Question

我有一个控制器：

.controller('myCtrl', function (myService) {
    var that = this;

    that.myService = myService;
});

服务：

.service('myService', function (DataFactory) {

    var listData = [];

    var mockList = ['aaa','bbb','ccc']; 

    var handleData = function (data) {
        listData = data;
    };

和html：

<button ng-click="myCtrl.myService.handleData()">Go</button>
<div ng-repeat="item in myCtrl.myService.listData>
    {{ item }}
</div>

事情是：我有一个列表，其中包含来自myService.listData的数据，并且（上面的所有代码）它按预期工作 - 通过点击按钮点击列表。

我添加：

that.list = myService.listData

并更改了

item in myCtrl.myService.listData to item in myCtrl.list

整个事情都停止了。

你可以向我解释一下吗？我觉得我错过了一些非常基本的东西，我需要开始搜索更多信息的方向。

plunks： working one broken

Answer 1

这里是working plunker。

您的误解是，您希望在点击that.myService时填充基础列表时更新handleData()。

但是，请查看您的handleData()实施：

listData = data;

你不会改变初始列表，你指向另一个（因此引用一个不同的列表），因为它充当了一个完整的重新分配！

因此解决问题的一种方法是改变初始列表：

var handleData = function (data) {
    // populating elements into the initial list
    Array.prototype.push.apply(listData, mockedList); 
};

AngularJS：关于实例化服务

1 个答案: