AngularJs监听服务的变化

时间:2013-04-19 19:52:36

标签: 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>

我还在plunkr http://plnkr.co/edit/BUPS6U0S7ktDEkH9dZTZ?p=preview

上创建了示例

1 个答案:

答案 0 :(得分:5)

原因是因为“监听器”控制器首先启动,因为它首先出现在View的HTML上。如果您切换订单,您将看到“第一个”消息。

还有一件事,当您设置对字符串的引用并稍后更改字符串时,您将丢失引用,这就是为什么引用对象然后呈现对象的属性更为强大的原因:

控制器:

$scope.Message = Message

查看:

{{Message.message}}

这样你就不会失去参考