有许多方法可以在控制器之间共享数据

使用服务 使用美元的状态。去服务 使用stateparams 使用rootscope

各方法说明:

I am not going to explain as its already explained by someone using $state.go $state.go('book.name', {Name: 'XYZ'}); // then get parameter out of URL $state.params.Name; $stateparam works in a similar way to $state.go, you pass it as object from sender controller and collect in receiver controller using stateparam using $rootscope (a) sending data from child to parent controller $scope.Save(Obj,function(data) { $scope.$emit('savedata',data); //pass the data as the second parameter }); $scope.$on('savedata',function(event,data) { //receive the data as second parameter }); (b) sending data from parent to child controller $scope.SaveDB(Obj,function(data){ $scope.$broadcast('savedata',data); }); $scope.SaveDB(Obj,function(data){`enter code here` $rootScope.$broadcast('saveCallback',data); });

不知道我在哪里得到了这个模式，但对于跨控制器共享数据和减少$rootScope和$scope，这工作得很好。这让人想起有发布者和订阅者的数据复制。希望能有所帮助。

服务:

(function(app) {
    "use strict";
    app.factory("sharedDataEventHub", sharedDataEventHub);

    sharedDataEventHub.$inject = ["$rootScope"];

    function sharedDataEventHub($rootScope) {
        var DATA_CHANGE = "DATA_CHANGE_EVENT";
        var service = {
            changeData: changeData,
            onChangeData: onChangeData
        };
        return service;

        function changeData(obj) {
            $rootScope.$broadcast(DATA_CHANGE, obj);
        }

        function onChangeData($scope, handler) {
            $scope.$on(DATA_CHANGE, function(event, obj) {
                handler(obj);
            });
        }
    }
}(app));

得到新数据的控制器，也就是发布者，会做这样的事情。

var someData = yourDataService.getSomeData();

sharedDataEventHub.changeData(someData);

同样使用这些新数据的控制器，也就是所谓的订阅服务器，会做这样的事情…

sharedDataEventHub.onChangeData($scope, function(data) {
    vm.localData.Property1 = data.Property1;
    vm.localData.Property2 = data.Property2;
});

这适用于任何场景。当主控制器被初始化，它得到数据时，它会调用changeData方法，它会把那个广播给那个数据的所有订阅者。这减少了控制器之间的耦合。

我已经创建了一个工厂来控制路由路径模式之间的共享作用域，因此您可以在用户在相同的路由父路径中导航时维护共享数据。

.controller('CadastroController', ['$scope', 'RouteSharedScope',
    function($scope, routeSharedScope) {
      var customerScope = routeSharedScope.scopeFor('/Customer');
      //var indexScope = routeSharedScope.scopeFor('/');
    }
 ])

因此，如果用户转到另一个路由路径，例如'/Support'，路径'/Customer'的共享数据将被自动销毁。但是，如果用户去到“子”路径，比如“/Customer/1”或“/Customer/list”，作用域不会被销毁。

您可以在这里看到一个示例:http://plnkr.co/edit/OL8of9

有多种方法可以在控制器之间共享数据

角服务 $broadcast， $emit方法 父到子控制器通信 rootscope美元

众所周知，$rootscope不是数据传输或通信的首选方式，因为它是一个全局作用域，可用于整个应用程序

对于Angular Js控制器之间的数据共享，Angular服务是最佳实践，例如.factory， .service 供参考

如果数据从父控制器传输到子控制器，您可以通过$scope直接访问子控制器中的父数据 如果你正在使用ui-router，那么你可以使用$stateParmas来传递url参数，如id，名称，键等

$broadcast也是在控制器之间从父控制器传输数据到子控制器的好方法，$emit是将数据从子控制器传输到父控制器的好方法

HTML

<div ng-controller="FirstCtrl">
   <input type="text" ng-model="FirstName">
   <br>Input is : <strong>{{FirstName}}</strong>
</div>

<hr>

<div ng-controller="SecondCtrl">
   Input should also be here: {{FirstName}}
</div>

JS

myApp.controller('FirstCtrl', function( $rootScope, Data ){
    $rootScope.$broadcast('myData', {'FirstName': 'Peter'})
});

myApp.controller('SecondCtrl', function( $rootScope, Data ){
    $rootScope.$on('myData', function(event, data) {
       $scope.FirstName = data;
       console.log(data); // Check in console how data is coming
    });
});

参考给出的链接了解更多关于$broadcast的信息

我不喜欢使用$watch。您可以只分配数据，而不是将整个服务分配给控制器的作用域。

JS:

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

myApp.factory('MyService', function(){
  return {
    data: {
      firstName: '',
      lastName: ''
    }
    // Other methods or objects can go here
  };
});

myApp.controller('FirstCtrl', function($scope, MyService){
  $scope.data = MyService.data;
});

myApp.controller('SecondCtrl', function($scope, MyService){
   $scope.data = MyService.data;
});

HTML:

<div ng-controller="FirstCtrl">
  <input type="text" ng-model="data.firstName">
  <br>Input is : <strong>{{data.firstName}}</strong>
</div>
<hr>
<div ng-controller="SecondCtrl">
  Input should also be here: {{data.firstName}}
</div>

或者，您可以使用直接方法更新服务数据。

JS:

// A new factory with an update method
myApp.factory('MyService', function(){
  return {
    data: {
      firstName: '',
      lastName: ''
    },
    update: function(first, last) {
      // Improve this method as needed
      this.data.firstName = first;
      this.data.lastName = last;
    }
  };
});

// Your controller can use the service's update method
myApp.controller('SecondCtrl', function($scope, MyService){
   $scope.data = MyService.data;

   $scope.updateData = function(first, last) {
     MyService.update(first, last);
   }
});

有多种方法可以做到这一点。

事件——已经解释得很好了。 UI路由器-上面解释了。 Service -使用上面显示的更新方法 坏——注意变化。 另一种父-子方法而不是发射和广播-

*

<superhero flight speed strength> Superman is here! </superhero>
<superhero speed> Flash is here! </superhero>

*

app.directive('superhero', function(){
    return {
        restrict: 'E',
        scope:{}, // IMPORTANT - to make the scope isolated else we will pollute it in case of a multiple components.
        controller: function($scope){
            $scope.abilities = [];
            this.addStrength = function(){
                $scope.abilities.push("strength");
            }
            this.addSpeed = function(){
                $scope.abilities.push("speed");
            }
            this.addFlight = function(){
                $scope.abilities.push("flight");
            }
        },
        link: function(scope, element, attrs){
            element.addClass('button');
            element.on('mouseenter', function(){
               console.log(scope.abilities);
            })
        }
    }
});
app.directive('strength', function(){
    return{
        require:'superhero',
        link: function(scope, element, attrs, superHeroCtrl){
            superHeroCtrl.addStrength();
        }
    }
});
app.directive('speed', function(){
    return{
        require:'superhero',
        link: function(scope, element, attrs, superHeroCtrl){
            superHeroCtrl.addSpeed();
        }
    }
});
app.directive('flight', function(){
    return{
        require:'superhero',
        link: function(scope, element, attrs, superHeroCtrl){
            superHeroCtrl.addFlight();
        }
    }
});