使用“Controller as”语法的控制器之间的通信

Question

正如我在 stackoverflow 上发现的，在 Angular 控制器之间进行通信的正确方法是使用服务。这里很少有主题可以演示如何使用 $scope 来实现。但是，如果我使用“controller as”语法而不使用 $scope，这种方法（使用服务）对我不起作用。 这是我的例子：

HTML

<div ng-app="myapp">
    <div ng-controller="PersonCtrl as person">
        <p>{{ person.name['last'] }}</p>
    </div>
     <div ng-controller="PersonCtrl2 as person2">
         Change name <button type="button" ng-click="person2.changeName()"> To Ted</button>
     </div>
</div>

JS

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

myapp.controller('PersonCtrl', function (myService1) {
    this.name = myService1.newName;
});

myapp.service('myService1', function() {
    this.newName = {'last': 'Bob'};
});


var PersonCtrl2 = function(myService1) {
    this.service = myService1;
};

PersonCtrl2.prototype.changeName = function() {
    alert('a');
    this.service.newName = {'last': 'Ted'};
};

myapp.controller('PersonCtrl2', PersonCtrl2);

小提琴 http://jsfiddle.net/vxQK7/

附： 我也想使用 $watch 来通知更新，但就我现在而言，我只能从 $scope 使用它，而不能使用“this”？

Answer 1

正如 callmekatootie 所说，您需要在服务中返回某些内容，但您也不需要破坏模型的引用

 this.name = myService1.newName

这将在 this.name 和 service.newName 之间创建一个链接，而不是值，而是实际对象

 this.service.newName = {'last': 'Ted'};

这会破坏另一个控制器所链接的对象并创建一个新的对象，而另一个控制器不知道该对象存在。

解决方案非常简单，如此链接中所述

http://jsfiddle.net/vxQK7/1/