我是 Angular 新手。我有一个显示姓名列表的小程序。我使用 listController 来管理列表的显示，并使用 editController 来提交更多名称，或将列表重置为其初始状态。我保存了两个 Controller 都可以访问的服务中的名称列表。
问题是，当 editController 重置列表时，listController 仍然不知道。我一直在为此绞尽脑汁，如果有人能快速浏览一下并找出问题所在，我将不胜感激？
<!DOCTYPE html>
<html>
<head>
<script data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="9ffef1f8eaf3feedb1f5ecdfaeb1acb1af" rel="noreferrer noopener nofollow">[email protected]</a>" data-semver="1.3.0" src="//code.angularjs.org/1.3.0/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="myApp">
<h1>List of People</h1>
<div ng-controller="MainCtrl as mc">
<ul>
<li ng-repeat="person in mc.list">
{{person.firstName}} {{person.lastName}}
</li>
</ul>
</div>
<form ng-controller="EditorCtrl as ec">
<h2>Add New Person</h2>
<fieldset>
<label>First name
<input ng-model="ec.person.firstName" />
</label>
<label>Last name
<input ng-model="ec.person.lastName" />
</label>
<button ng-click="ec.save()">Save</button>
<button ng-click="ec.reset()">Reset</button>
</fieldset>
</form>
</body>
</html>最佳答案
好的，这就是您的代码的运行方式
- MyFactory 服务初始化并创建一个列表数据，我们将此列表称为 list1
- MainCtrl 被初始化并获取 list1 数据
- EditorCtrl 已初始化
- 输入一些数据并保存数据，这将被放入 list1
- 按重置键，列表将重新创建，并且列表 1 不再在服务中引用。现在我们有了列表 2。
- 输入一些数据并保存数据，这将被放入 list2
但是，MainCtrl 仍然拥有 list1 的数据，因此不会更新。
最重要的是，数组作为引用而不是值传递，因此，如果您希望数组按照其在应用程序中应有的方式运行，则不要破坏数组，这一点很重要。
当您重置列表时，它会重新创建数组并丢弃其现有引用，但 mainCtrl 中的引用仍然是旧引用。
//this will recreate the array
list = [{
firstName: 'Rachel',
lastName: 'Washington'
}, {
firstName: 'Joshua',
lastName: 'Foster'
}, {
firstName: 'Samuel',
lastName: 'Walker'
}, {
firstName: 'Phyllis',
lastName: 'Reynolds'
}];
所以重要的是你不要这样做，将其更改为
var data = [{
firstName: 'Rachel',
lastName: 'Washington'
}, {
firstName: 'Joshua',
lastName: 'Foster'
}, {
firstName: 'Samuel',
lastName: 'Walker'
}, {
firstName: 'Phyllis',
lastName: 'Reynolds'
}];
list.length = 0;
angular.forEach(data, function(val){
list.push(val);
})
这样您就不会重新创建数组，请注意没有“list = Something”。
list.length = 0; //removes all items but does not remove the reference
删除项目后，您可以再次填充。
请记住，您还应该将列表变量初始化为数组。
var list = [];
关于angularjs - 在两个 Controller 之间共享服务的数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28598475/