当在 AngularJS 中使用 ngRepeat 指令来展示一个数组时，有时候我们需要更新这个数组中的某些元素。但是，如果我们只是简单地修改了数组中的元素，并没有重新分配新的数组，那么 ngRepeat 并不会自动刷新对应的视图，这可能会导致一些奇怪的行为。
问题描述
考虑下面的例子：
-- -------------------- ---- -------
---- -------------- -----------------------
---- --------------- -- -------
-- ---- --
------
------- -------------------------------
------
--------
--- --- - ----------------------- ----
------------------------ ---------------- -
------------ - ----- ---- -----
------------- - ---------- -
-- -----------
--------------- - ----
--
---
---------在这个例子中，我们展示了一个包含三个元素的数组，并且有一个按钮可以更新这个数组中的第二个元素。但是，当我们点击按钮时，视图并不会自动刷新，而是仍然展示原来的内容。
解决方案
要解决这个问题，我们需要告诉 AngularJS 在更新数组后重新渲染对应的视图。这可以通过调用 $scope.$apply() 方法来实现。具体地，在上面的例子中，我们可以将 update() 函数改为：
$scope.update = function() {
// 修改数组中的第二个元素
$scope.items[1] = 'd';
// 通知 AngularJS 重新渲染视图
$scope.$apply();
};现在，当我们点击按钮时，视图会自动更新以展示新的内容。
深入学习
上面的解决方案是比较简单和通用的，但是它并不涉及到太多关于 AngularJS 内部工作原理的细节。如果你想更深入地了解这个问题，以下是一些可能有用的资源：
- The ngRepeat Directive：AngularJS 官方文档中关于
ngRepeat的详细说明。 - AngularJS 中的数据绑定：本文只是介绍了一个小问题，如果你想更全面、系统地学习 AngularJS 中的数据绑定机制，这篇文章可能会有所帮助。
总结
在 AngularJS 中使用 ngRepeat 展示数组时，如果需要更新数组中的元素，需要手动调用 $scope.$apply() 方法来触发视图的刷新。这个方法可以让 AngularJS 在下一个脏检查周期中重新渲染对应的视图。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/29225