Angular服务不更新控制器

Question

我正在使用角度控制器和服务。我的理解是，在通过控制器之间的服务共享日期的情况下，我有责任更新服务，因为它没有范围。我在输入字段上设置了一个监视，并在输入更改时更新了服务。为什么其他控制器中的服务没有更新？它是一个单例并且有一个实例..不应该更新另一个控制器中的引用吗？我找到的唯一解决方案是添加一个监视器来监听服务和模型的变化，但现在每个控制器有两个监听功能可以双向监听。它是否正确？我觉得如果我更新服务，值应该在另一个控制器中更新，因为一切都指向相同的值。

https://jsfiddle.net/86hry8a5/

  <div ng-controller="mainController as mainCtrl">
    <div>
      <input type="text" ng-model="mainCtrl.message" />
    </div>
    <div>
      {{mainCtrl.message}}
    </div>
  </div>
  <hr/>
  <div ng-controller="secondController as secondCtrl">
    <div>
      <input type="text" ng-model="secondCtrl.message" />
    </div>
    <div>
      {{secondCtrl.message}}
    </div>
  </div>

  .controller('mainController', function(mainService, $scope){
      var self = this;
      self.message = mainService.message;
      $scope.$watch(function(){return mainService.message}, function(){
          self.message = mainService.message;
      });
      $scope.$watch(function(){return self.message}, function(){
          mainService.message = self.message;
      });
  })

  .controller('secondController', function(mainService, $scope){
      var self = this;
      self.message = mainService.message;
      $scope.$watch(function(){return mainService.message}, function(){
          self.message = mainService.message;
      });
      $scope.$watch(function(){return self.message}, function(){
          mainService.message = self.message;
      });
  })

  .service('mainService', function(){
      var self = this;
      self.message = 'service';

  }
);

Answer 1

更新服务中的值不会自动更新第二个控制器中的值，因为第二个控制器没有“观察”服务值的更改。

为了达到您的目的，您必须像您已经完成的那样创建自己的“手表”。

但是，更好的方法是发射事件。每个控制器在更新服务中的值时都会发出事件。另一个控制器将监听此事件并更新其本地副本。

在输入框中使用ng-change，如下所示：

  <input type="text" ng-model="mainCtrl.message" ng-change="mainCtrl.changeHandler()" />

发出和订阅事件的两个控制器中的控制器代码：

      self.changeHandler = function () {
        mainService.message = self.message;
        $rootScope.$broadcast('MAIN_SERVICE_VALUE_CHANGED');
      };
      $rootScope.$on('MAIN_SERVICE_VALUE_CHANGED', function () {
        self.message = mainService.message;
      });

Here is a working fork of your fiddle updated with event logic

Answer 2

  

为什么这仅适用于对象的引用？而不只是服务中的财产？

引用是指向内存中对象的实体。当函数返回对象引用时，每个控制器都会获得相同的指针。

对象的内容由所有控制器共享。所有控制器都可以看到对内容的更改。

使用原语仅传输值。所有控制器都看不到后续更改。

另见JavaScript Pass Object as a Reference