AngularJs数组未绑定到模板

Question

我有一个名为dataController的控制器，两个名为dataHttpServices和

dataLocalServices在我的html模板中，我有两个不同的选项卡，它们使用相同的控制器，并从两个不同位置将项目添加到控制器中的列表中。

在调试模式下，我看到数据更改正常，但数据绑定工作不正常。

我不知道我犯了什么错，请帮帮我。在代码中；

这是Html；

<div 
class="metadataSelect"
layout="column" 
ng-model="selectedItems" 
ng-show="selectedItems.length > 0">                                 
<div layout="row" ng-repeat="item in selectedItems">
{{item.Name}}
</div>
</div>

这是控制器；

$scope.addSelectedItem = function (selectedItem) {
var found = false;
var self = this;
dataLocalService.addSelectedItem(selectedItem);
$scope.selectedItems = dataLocalService.getSelectedItems();
};

这是服务；

this.selectedItems = [];
this.addSelectedItem = function (item) {
this.selectedItems.push(item);
};
this.getSelectedItems = function () {
return this.selectedItems;
};

我在两个不同按钮的点击事件中从作用域调用addSelectedItem，点击ng。

如果我第一次通过点击第一个按钮并点击第二个按钮(第一次点击第一个)来添加一个项目，那么该按钮将数组正确绑定到div。

但是，当我在单击第一个按钮之前单击第二个按钮添加项目时，数组不会绑定到div

单击第二个按钮将一些项添加到数组后，当我单击第一个按钮时，将所有元素绑定到div。例如，一次绑定三个元素，但不单击第一个键就不会绑定。

我犯了什么错。谢谢你的帮助。

Answer 1

我使用$scope解决了这个问题$观看。我认为问题是它们的范围不同，因为我用ng控制器创建了两次控制器。这是我找到的解决它的代码片段。

$scope.$watch('selectedItems', function () {
$scope.selectedItems = $metadataLocalService.getSelectedItems();
});

这解决了我的问题。因为手表正在跟踪相关数据的变化等。