совместное использование объекта через контроллеры angularjs с помощью сервиса

0

Да, я знаю, что этот вопрос задан, но у меня все еще есть проблемы, следуя инструкциям здесь.

У меня два контроллера и вы хотите поделиться одним простым объектом через службу следующим образом:

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
Лучший ответ

Если вы хотите делиться некоторыми данными между ними и обновлять, вам даже не нужны дополнительные слушатели, и вам даже не нужна фабрика. Достаточное хранение значений. Вы можете сделать это:

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;
});

Я обновил плункер: http://plnkr.co/edit/yCqmHMaH6ev9CA2HwQE1?p=preview

Поделиться
  • 0
    Спасибо за ваш ответ. Но если я хочу изменить DataSrvc из CtrlOne следующим образом: $ scope.data = {var1: 'some var', var2: 'some other var'}, а затем назначить его для Srv: DataSrvc = $ scope.data; - вид и CtrlTwo не будут обновлены. Пожалуйста, помогите.
  • 0
    да, просто значения являются константами, поэтому вы не можете изменять саму переменную (или переопределять), только ее значение: plnkr.co/edit/CMy8PjVhy4vQYXTtepRv?p=preview
Показать ещё 1 комментарий
0

Вы можете использовать шаблон наблюдателя. Наблюдение за вашим сервисом и регистрация обратных вызовов для уведомления наблюдателей. Используя этот метод, вы можете подписаться на своих подписчиков на свою службу, добавив сеттер для ваших переменных, который затем уведомит всех ваших наблюдателей (ваших контроллеров).

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]();
    }
  }
});
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню