Javascript AngularJs侦听服务更改

为什么在1、2、3种情况下，更改服务中的消息不会影响显示的消息

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

app.factory('Message', function() {
  return {message: "why this message doesn't changed"};
});

app.controller('Changer', function($scope, Message) {
  Message.message = "first" // (1)

  $scope.changeItems = function() {
    Message.message = "second" // (2)
  }
});

app.controller('Listener', function($scope, Message) {
  $scope.message = Message.message
  Message.message = "third" // (3)
});

我的看法是：

<div ng-controller="Listener">
  {{ message }}  
</div>

<div ng-controller="Changer">
  <button ng-click="changeItems()">change message</button>
</div>

{{message}}
更改消息

我还在plunkr上创建了一个示例，原因是“侦听器”控制器首先被启动，因为它首先出现在视图的HTML上。如果您切换顺序，您将看到“第一条”消息

还有一件事，当您设置对字符串的引用并随后更改该字符串时，您将丢失该引用，这就是为什么引用对象然后按如下方式渲染对象的属性更有效：

控制器：

$scope.Message = Message

视图：

这样就不会丢失引用，原因是“侦听器”控制器首先被启动，因为它首先出现在视图的HTML上。如果您切换顺序，您将看到“第一条”消息

还有一件事，当您设置对字符串的引用并随后更改该字符串时，您将丢失该引用，这就是为什么引用对象然后按如下方式渲染对象的属性更有效：

控制器：

$scope.Message = Message

视图：

这样你就不会丢失参考资料