javascript - Controller 内的 AngularJS Controller

Question

我最近一直在使用 AngularJS，我觉得我可能对范式的思考有误。

我有一个 Pane Controller (绑定(bind)到 ng-repeat)，它跟踪用户打开了哪些“ Pane ”。现在，每个 Pane 都将包含数据，这意味着几乎所有 Pane 中都会有另一个 Controller 。

我读了one answer here (with a similar situation)其中答案建议将他们的“弹出” Controller 重写为服务。

Pane Controller :

app.controller('PaneCtrl', function ($scope, PaneService){
    var updatePanes = function(panes){
        $scope.panes = panes;
    }

    // subscribes this controller to the Pane Service
    PaneService.registerObserverCallback(updatePanes)
});

服务

app.factory('PaneService', function(){
    var observerCallbacks=[]
    var panes = []

    var notifyObservers = function(){
        angular.forEach(observerCallbacks, function(callback){
            callback(panes);
        });
    }

    return {
        createRootPane: function(title, meta, data){
            // do stuff
        },

        toggleSearchPane: function(){
            // do stuff
            notifyObservers();
        },

        registerObserverCallback: function(callback){
            observerCallbacks.push(callback);
        }
    }
});

---

我的问题是这里的最佳实践是什么，如果最佳实践是“将其重写为仅服务”，该服务会是什么样子？

Answer 1

我建议您将其重写为指令，并在指令的 Controller 中创建模型 <=> View 关联。

关于 Angular Documentation 中指令的 Angular 文档中有一个选项卡示例在 Creating Directives that Communicate 下.如果您要从外部数据源获取数据以填充作用域，或者使用缓存，请使用工厂。