使用服务在angularjs控制器之间共享对象

时间:2015-06-29 01:52:02

标签: angularjs

是的,我知道这个问题已被问到,但我仍然有问题,请按照此处的指南进行操作。

我有两个控制器,想要通过服务共享一个简单的对象,如下所示:

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

app.controller('CtrlOne', function($scope,DataSrvc) {
  $scope.data={
    var1:'controller1 var one',
    var2:'controller1 var two'
  };
  $scope.$on('name',function(){
   DataSrvc.var1=$scope.data.var1;
   DataSrvc.var2=$scope.data.var2; 
  });
})
.controller('CtrlTwo',function($scope,DataSrvc){
  $scope.data=DataSrvc;
});

app.factory('DataSrvc',function(){
  return {
   var1:'',
   var2:''
  }
});

我希望控制器2在控制器1更改时自动更新对象。但是我在这里做错了什么?请指教。

这里是http://plnkr.co/edit/LO0qQfyV94A9YEBLsk2R?p=preview代码

2 个答案:

答案 0 :(得分:0)

如果你只想在它们之间分享一些数据并进行更新,你甚至不需要额外的听众,你甚至不需要工厂。价值储存就足够了。你可以这样做:

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

app.value('DataSrvc',{var1:"value 1",var2:"value 2"});

app.controller('CtrlOne', function($scope,DataSrvc) {
$scope.data = DataSrvc; 
})

app.controller('CtrlTwo',function($scope,DataSrvc){
 $scope.data=DataSrvc;
});

我更新了plunker: http://plnkr.co/edit/yCqmHMaH6ev9CA2HwQE1?p=preview

答案 1 :(得分:0)

您可以使用观察者模式。使您的服务可观察并注册回调以通知观察者。使用此方法,您可以订阅服务的两个订阅者,为您的变量添加一个setter,然后通知所有观察者(您的控制器)。

app.controller('CtrlOne', function($scope,DataSrvc) {
  $scope.data={
    var1:'controller1 var one',
    var2:'controller1 var two'
  };
  $scope.$on('name',function(){
   DataSrvc.setVar1=$scope.data.var1;
   DataSrvc.setVar2=$scope.data.var2; 
  }); 
})
.controller('CtrlTwo',function($scope,DataSrvc){
  $scope.var1=DataSrvc.getVar1;
  $scope.var2=DataSrvc.getVar2;
  DataSrvc.subscribe(function() {
    $scope.var1=DataSrvc.getVar1;
    $scope.var2=DataSrvc.getVar2;
  });
});

app.factory('DataSrvc',function(){
    var callbacks = [];
    var var1 = '';
    var var2 = '';  
  return {
   setVar1: setVar1,
   setVar2: setVar2,
   getVar1: getVar1,
   getVar2: getVar2,
   subscribe: subscribe
  }

  ////////////////
  function getVar1() {
    return var1;
  }

  function getVar2() {
    return var2;
  }

  function setVar1(newVar1) {
    var1 = newVar1;
    notify();
  }

  function setVar2(newVar2) {
    var2 = newVar2;
    notify();
  }

  function subscribe(callback) {
    callbacks.push(callback);
  }

  function notify() {
    for(var i = 0; i < callbacks.length; i++ ) {
        callbacks[i]();
    }
  }
});