AngularJS - updating service-based model from directive -

AngularJS - updating service-based model from directive -

i think i've flaw in design of angularjs app.

i have service contains 1 of model items , methods associated adding/deleting them. service injected core app , directive. issue removing items in model directive. doing because directive physically represents each of model items. alter happening, not pushing way core app exposes model. realize because i'm not telling update, issue don't understand how to. adding $apply in directive after calling service causes error apply in progress, feels wrong approach.

i've set model in service want single instance of info entire app.

can suggest improve way of achieving this? storing model in service idea?

service:

angular.module("app").service("widgetservice", function () { this.widgets = []; this.removewidget = function() { <!-- remove item this.widgets --> } this.getwidgets = function() { homecoming this.widgets; } this.setwidgets = function(widgets) { this.widgets = widgets; ) }

core app:

app.controller("coreappcontroller", function($scope, $http, widgetservice) { $scope.widgets = widgetservice.getwidgets(); }

html:

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

directive:

mykss.mykssapp.directive("widget", function($compile) { homecoming { restrict: "e", replace: true, templateurl: "partials/widget.html", scope: { }, controller: function($scope, $element, $attrs, widgetservice) { $scope.removewidget = function() { widgetservice.removewidget(); }; } } }

there 1 thing i've notices: shouldn't give possibility alter value of widgets variable of service - otherwise couldn't track adding/removing (i mean this.setwidgets method of service should removed)

everything else should work (with other minor changes): http://plnkr.co/edit/fqmwfi5d7nikjhxtxsc6?p=preview

angularjs