Question

我知道有很多方法可以在Angular中的控制器之间共享数据。例如从父作用域窥探原型数据，通过作用域事件，共享服务等通知控制器。

但是，在视图中为所有控制器共享数据的惯用方法是什么？

我已阅读此帖：Share data between controllers in AngularJS

这是要走的路吗？先解决加载的数据，然后分享结果？

Answer 1

您可以使用要共享的双向绑定变量编写包含控制器内部和隔离范围的指令

JS：

(function() {
  var app = angular.module('myApp', []);

  app.controller('main',['$scope', function($scope) {
    $scope.sharedVar = 1;
  }]);
  app.directive('dOne', function() {
    return {
      scope: {
        sharedVar: '='
      },
      controller: ['$scope',function($scope) {
        $scope.changeVar = function(val) {
          $scope.sharedVar = val;
        }
      }],
      template: "<div>controller1<button ng-click='changeVar(3)'>clickMe!</button> value: {{sharedVar}}</div>"
    };
  });

  app.directive('dTwo', function() {
    return {
      scope: {
        sharedVar: '='
      },
      controller: ['$scope',function($scope) {
        $scope.changeVar = function(val) {
          $scope.sharedVar = val;
        }
      }],
      template: "<div>controller2<button ng-click='changeVar(2)'>clickMe!</button> value: {{sharedVar}}</div>"
    };
  });
})();

html

<body ng-app="myApp" ng-controller='main'>
    <d-one shared-var="sharedVar"></d-one>
    <d-two shared-var="sharedVar"></d-two>
  </body>

plunker

另一种选择是使用$ parent范围 plunker using $parent scope

Answer 2

我最终在我的路由器上使用resolve，因此初始值已经预先解决，然后可供所有控制器使用。

在AngularJS中控制器之间共享数据的惯用方法

2 个答案: