각형 검색 $ 시계 지연

Question

이 plunker에 내가 검색 할 때 총 시간이 표시되지 않고 대신 이전에 검색 한 총 나이가 표시됩니다.

스크립트

$scope.$watch('search',function(){ 
    console.log($scope.filteredItems); 
    if($scope.filteredItems){ 
      var x = $scope.filteredItems.length; 
      var total = 0; 
      for(var i = 0; i < x; i++){ 
       total = total + parseInt($scope.filteredItems[i].age); 
      } 
      $scope.getTotal = total; 
     } 
    }); 

HTML

<tr dir-paginate="data in (filteredItems = (names | filter:search | orderBy:orderByColumn:!reverseSort | itemsPerPage:5))"> 
    <td>{{data.id}}</td> 
    <td>{{data.name}}</td> 
    <td>{{data.age}}</td> 
</tr> 

나는 $watch는 좋은 선택이 $watch들보다 어쨌든 대체하지 생각?

Answer 1

$watch이 필요하지 않으며 간단한 getTotal() 기능 만 있으면 충분합니다.

따라서 getTotal 속성을 함수로 변경하고 $watch을 제거하십시오.

<div>total age <b>{{getTotal()}}</b></div> 

컨트롤러 에서 : 여기

$scope.getTotal = function() { 
    var total = 0; 
    if ($scope.filteredItems) { 
    var x = $scope.filteredItems.length; 
    for (var i = 0; i < x; i++) { 
     total = total + parseInt($scope.filteredItems[i].age); 
    } 
    } 
    return total; 
    } 

가 Fixed plunker

편집

$ 와트

는 HTML에서처럼 수행 $ 시계가 필터보다 우선 순위가 높고 데이터가 필터링되기 전에 실행되므로 올바른 방식으로 작동하지 않으므로 항상 이전 데이터가 있습니다.