0

我在控制器中定义了一个范围,如下所述:

控制器 :

var app = angular.module('app', ['ui.select2']);

app.controller('MyCtrl',
  [
    '$scope',
    '$q',
    '$timeout',
    function ($scope, $, $timeout) {
      $scope.data = {};
       $scope.countries = [{
          name : 'India', code : 'IA'
        }, {
          name : 'Israel', code : 'IS'
        }];

        $scope.selectedCountries = [
          'IA'
        ];

        $scope.$watch('selectedCountries', function(newValue, oldValue) {
           console.log ('data');
    });
]);

视图看起来像这样:

<select
        ui-select2
        multiple
        ng-model="selectedCountries"
        data-placeholder="Choose or Search for countries"
        name="countries"
        style="width:200px;">
        <option ng-repeat="country in countries" value="{{country.code}}">{{country.name}}</option>
</select>

现在,当使用选择下拉列表在控制器中更改值时,值更改会反映在视图中。但是手表永远不会被调用,因为范围没有改变。知道为什么范围没有更新吗?

4

1 回答 1

0

观看集合true作为第三个参数传递给 $watch,所以它变成:

$scope.$watch('selectedCountries', function(...) {...}, true);

这使得 $digest 递归地遍历集合,而不是仅仅进行参考检查。

或者,如果你有一个深层结构并且你只需要知道底层是否发生了变化(即添加或删除元素),你可以使用 $watchCollection 而不是 $watch。

更新:工作 Plunker(无需深度 $watch() 即可工作):http ://www.plnkr.co/edit/VaWBq9?p=preview

于 2013-08-25T17:03:20.920 回答