angularjs怎么在两个controller之间传递数据

Posted 2023-04-26

有时需要两个controller相互通信，我学习到的两个controller之间的通信是：父级controller通过广播向子controller传递信息，而子controller通过冒泡向父级controller传递信息。假如不是两个controller的话，可以构造一个父级controller，然后通过它来广播信息。还有一种是通过工厂模式来注册一个服务，通过服务来传递信息。而所说的冒泡和广播就是angularjs的$emit和$broadcast，通过这两种方法的话，要绑定事件，才可以进行广播或者冒泡。
下面这种是$emit和$broadcast

假如是父级controller和子controller的通信的话,也可以用$watch()来监控你要的信息。不过只能子级的监控父级。$watch("tag",function());tag是你要监控的变量了。 参考技术A 举例：
.controller('a',['scope',$rootScope',function($scope,$rootScope)
$rootScope.u=$scope.username1
]);
.controller('b',['scope',$rootScope',function($scope,$rootScope)
$scope.username2=$rootScope.u
])；
说明：通过父子作用域来传递，a中的username1通过子作用域传递给父作用域$rootScope,然后在b中通过父作用域$rootScope传递给b中的username2，从而实现两个controller之间的数据传递

AngularJS 笔记之创建服务方式比较 ： factory vs service vs provider 。

首先说一下服务这个东西是用来干嘛的。很多时候我们把太多的数据和逻辑都一股脑儿地往 controller 里放。这样我们的 controller 原来越臃肿。从它们的生命周期可以发现，其实 controller 应该在需要的时候被初始化，不用了就直接被抛弃，释放内存。因此，当我们切换或者刷新页面的时候，angular 就会清空当前的 controller。与所以，service 才应该被用来保存应用业务逻辑和持久化的数据，并且这些数据可以在不同的 controller 之间应用。

那么问题来了，（学挖掘机找蓝翔吗）Angular 提供了三种方法来创建并注册我们的 service：factory, service 和 provider 。

Factory :

• 用 factory 就是创建一个对象，为他添加属性，然后把这个对象 return 出来。当你把 service 传进 controller 以后，在 controller 中这个对象的属性就可以通过 factory 使用了。
  • var app = angular.module(‘app‘,[]);
  • app.factory(‘myFactory‘,function(){
  •   var test = {};
  •   test.name = "Jason";
  •   test.sayHello = function(){console.log("hello world")};
  •   return test;
  • });
  • app.controller("myCtrl",function($scope,myFactory){
    　$scope.greet =myFactory.test.sayHello;
       //use the attrs of the obj in the factory
  • })
  • 这大概就是 factory 的用法了。
    
    
• Service:
  
  • service 是用 new 关键字实例化的。因此，你应该给 this 添加属性，然后 service 返回 this。你把 service 传进 controller 以后，在 controller 里 this 上的属性就可以用通过 service 来使用了。
  • app.service(‘myService‘,function(){
        var _artist = "Nelly";
        this.getAritist = function(){
        return _artist;
    }
    });
    app.controller("myCtrl",function($scope,myService){
        $scope.getArtist = myService.getArtist;
    });
    
    
    
    
• Provider :
  
  • Providers 是唯一一种你可以传进 .config() 函数的 service。当你想要在 service 对象启用之前，先进行模块范围的配置，那就应该用 provider。
  • app.provider("myProvider",function(){
        this._artist = " " ;
        this.thingFromConfig = " " ;
        this.$get = function(){
            var that  =  this;
            return  {
               getArtist : function(){
                   return that._artist;
                },
      　　    thingOnConfig : that.thingFromConfig
            }
       },
       thingOnConfig 
    });
    
    app.controller("myController",function($scope,myProvider){
        $scope.artist = myProvider.getArtist();
        $scope.data.thingFromConfig = myProvider.thingOnConfig;
    });
    
    app.config(function(myProviderProvider){
        myProviderProvider.thingFromConfig = "This was set in config() " ;
    })