AngularJS - 지시어에서 서비스 기반 모델 업데이트

Question

내 AngularJS 앱의 디자인에 결함이 있다고 생각합니다.

모델 항목 중 하나와 추가/삭제와 관련된 메소드가 포함 된 서비스가 있습니다. 이 서비스는 핵심 애플 리케이션과 지시문에 주입됩니다. 내 문제는 지시문에서 모델의 항목을 제거하는 것입니다. 지시문이 각 모델 항목을 물리적으로 나타 내기 때문에이 작업을 수행하고 있습니다. 변화가 일어나고 있지만, 모델을 드러내는 핵심 앱으로 되돌아 가지 않습니다. 업데이트가 필요하다고 알려주지 않았기 때문에 이것이 사실임을 알고 있습니다.하지만 문제는 실제로 어떻게하는지 이해할 수 없습니다. 서비스를 호출 한 후 $apply을 지시문에 추가하면 이미 적용이 진행 중임을 알리는 오류가 발생하므로 잘못된 접근이라고 생각됩니다.

전체 응용 프로그램에 대해이 데이터의 단일 인스턴스 만 필요하기 때문에 모델에 서비스를 추가했습니다.

누구나 이것을 달성 할 수있는 더 좋은 방법을 제안 할 수 있습니까? 모델을 서비스에 저장하는 것이 좋은 생각입니까?

서비스 :

angular.module("App").service("widgetService", function() { 
    this.widgets = []; 

    this.removeWidget = function() { 
     <!-- remove item from this.widgets --> 
    } 

    this.getWidgets = function() { 
     return this.widgets; 
    } 

    this.setWidgets = function(widgets) { 
     this.widgets = widgets; 
    ) 
} 

핵심 응용 프로그램 :

App.controller("CoreAppController", function($scope, $http, widgetService) { 
    $scope.widgets = widgetService.getWidgets(); 
} 

HTML :

<widget data-ng-repeat="widget in widgets" /> 

지침 :

myKSS.MyKSSApp.directive("widget", function($compile) { 
    return { 
     restrict: "E", 
     replace: true, 
     templateUrl: "partials/Widget.html", 
     scope: { 
     }, 
     controller: function($scope, $element, $attrs, widgetService) { 
      $scope.removeWidget = function() { 
       widgetService.removeWidget(); 
      }; 
     } 
    } 
} 

Answer 1

내가 통지를했습니다 한 가지있다 : 당신이 서비스의 widgets 변수의 값을 변경할 수있는 가능성을주지해야한다 - 그렇지 않으면 추가/제거 추적 할 수

(I 제거되어야 할 서비스의 this.setWidgets 방법을 의미) 그 밖의 다른 것들은 (다른 약간의 변경과 함께) 작동해야합니다 : http://plnkr.co/edit/fQMwfI5d7nikjhXTXSC6?p=preview