我目前正在学习AngularJS。
在更新对象数据时，我一直试图更新从指令生成的一系列按钮。
我已经阅读了许多针对类似问题的文章，这些文章针对未在指令中创建的数据将无法更新的问题。
的HTML
<body>
<div id="application" data-ng-app="ApplicationDirective" ng-controller="ApplicationController" class="container-fluid">
<side-panel class="col-lg-2"></side-panel>
<div ng-controller="HomeController" class="content col-lg-10">
</div>
</div>
</body>
如您所见，我定义了2个控制器。 1
ApplicaitonControler来管理整个应用程序，然后第二HomeController来管理HMTL的内部。然后，我有了一条指令，该指令为侧面板生成一系列按钮。
var app = angular.module('ApplicationDirective', []);
app.directive("sidePanel", function() {
return {
restrict: "E",
template : "<div>" +
"<input ng-repeat='btn in sidePanelButtons' type='button' value={{btn.value}}>" +
"</div>"
};
});
以上的
$scope数据在ApplicationContoller中定义。然后，我更新HomeController中的数据。app.controller("HomeController", function($scope) {
$scope.sidePanelButtons = $scope.sidePanelButtons.concat([
{value:"TEST"}
]);
});
此时，如果我记录sidePanelButtons var，那么我可以看到数据已成功附加，但是HTML中没有任何变化吗？
我尝试使用$ scope。$ apply方法，但是得到了error。
我的设计方法可能不正确，因此可以提供任何帮助。
最佳答案
concat()方法返回一个新数组。
所以当你这样做
$scope.sidePanelButtons = $scope.sidePanelButtons.concat([
{value:"TEST"}
]);
您正在HomeController范围中创建一个新的
sidePanelButtons属性，从而破坏对sidePanelButtons范围中ApplicationController数组的引用。您的侧面板指令正在监视ApplicationController范围，这些范围保持不变。改为使用
$scope.sidePanelButtons.push()。关于javascript - 在数据更改时更新ng-repeat，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36906270/