AngularJS：ng-repeat $ scope值后未按预期更新

Question

我有一个控制器，其中包含要通过ng-repeat进行迭代的数据，并且将其与选择模型指令一起使用。

使用ng-repeat在DOM中创建多个条目后，对$ scope.selectedItems的绑定将停止工作。

我知道ng-repeat会为每次迭代创建一个新的子范围，但是是否不应该通过绑定到MyController中的值来获取对selectedItems属性的更新？

控制器：

(function() {
    angular.module('myModule', ['product.module'])
        .controller('MyController' ['$scope', 'SomeService' function($scope, ProductService) {
            $scope.selectedItems = [];
            $scope.productService = new ProductService()  //constructor pattern object
            $scope.products = $scope.productService.items;

            $scope.productService.fetchData(); //grabs data from server and sets the productService.items to an array of objects                
        }]);
})();

HTML

<div ng-controller="MyController">
<ul>
    <li ng-repeat="product in products"
        selection-model-type="checkbox"
        selection-model-mode="multiple"
        selection-model-selected-items="selectedItems">
        {{product.name}}
    </li>
</ul>


<div ng-controller="MyController"> <!-- this binding doesn't work after the ng-repeat takes place -->
    There are {{selectedItems.length}} products
</div>

Answer 1

productService.items可能一直都引用同一实例，但selectedItems肯定不会引用。 仅使用一个控制器或将selectedItems放入服务中。

<div ng-controller="MyController">
<ul>
    <li ng-repeat="product in products"
        selection-model-type="checkbox"
        selection-model-mode="multiple"
        selection-model-selected-items="selectedItems">
        {{product.name}}
    </li>
</ul>

    There are {{selectedItems.length}} products
</div>