Question

在角度范围内，我有一个经过过滤的人员列表，这些人员从谓词函数中获取过滤条件。每当过滤列表更改时，我都想观看过滤列表的变量（称为filteredPeople）。但是我看不到该变量何时更改。

我的代码如下：

HTML：

<ul>
    <li ng-repeat="person in ($ctrl.filteredPeople = ($ctrl.people | filter: $ctrl.filter))">
      ...
    </li>
</ul>

JS：

controller: ['$scope',
    function ($scope) {
        var $ctrl = this;

        $ctrl.people = {...}
        $ctrl.filteredPeople = [];


        $scope.$watch($ctrl.filteredPeople, function () {
           console.log("called"); //not being called 
        });

        $ctrl.filter = function (p) {
           //custom filter function for each item in the array of people
        }

      }]

我可以回答任何需要提供更多代码的问题

Answer 1

angular.module('app', []).controller('ctrl', function($scope) {
  var vm = this;
  vm.items = [
    { name: 'Sam' },
    { name: 'Max' },
    { name: 'Tom' },
    { name: 'Henry' },
    { name: 'Jack' },
    { name: 'Kate' }
  ]
  var counter = 1;
  $scope.$watchCollection('vm.filtered', function(){
    console.log('Changed' + counter++);
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js">
</script>

<div ng-app='app' ng-controller='ctrl as vm'>
  <input type='text' ng-model='vm.filter' />
  <ul>
    <li ng-repeat='item in vm.filtered = (vm.items | filter : vm.filter)'>{{item}}</li>
  </ul>  
</div>

AngularJS-观看过滤后的更改列表

1 个答案: