1

我认为我的 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();
            };
        }
    }
}
4

1 回答 1

0

我注意到一件事:您不应该更改widgets服务变量的值 - 否则您无法跟踪添加/删除(我的意思this.setWidgets是应该删除服务方法)

其他一切都应该工作(有一些其他的小改动):http ://plnkr.co/edit/fQMwfI5d7nikjhXTXSC6?p=preview

于 2013-02-05T14:39:23.627 回答