0

ngRepeat 지시문은 필터의 출력을 기준으로 계산합니다. 이것은 동적 필터의 값을 변경하는 경우를 제외하고는 예상대로 작동합니다. 필터 값을 변경하면 ngRepeat 필터가 제대로 필터되지만 카운트가 항상 필터로 업데이트되는 것은 아닙니다. 그들은 때로는하지만 때마다 않습니다. 매번 값이 업데이트되도록하려면 어떻게해야합니까?AngularJS 범위가 변경 될 때 계산을 수행하는 지시문

ngRepeat이

<li class="list-group-item" data-ng-repeat="e1 in events | availFilter:filterBy | unique:team" ng-init="teamCount = (events | availFilter:filterBy | filter:{team:e1.team})"> 
<div class="list-group-item-header" data-ng-click="headerClick($event)" > 
    <span class="title">{{ e1.team }}</span> 
    <span class="badge">{{ teamCount.length }}</span>' 
</div> 

필터를 변경 제어

<li role="presentation" data-ng-class="{ active: activeTab('today') }"> 
    <a data-ng-click="filterBy = 'today';">Today</a> 
</li> 
<li role="presentation" data-ng-class="{ active: activeTab('before8') }"><a data-ng-click="filterBy = 'before8';">Before 8am</a></li> 
<li role="presentation" data-ng-class="{ active: activeTab('after5') }"><a data-ng-click="filterBy = 'after5';">After 5pm</a></li> 

필터

availApp.filter('availFilter', function() { 
    return function (collection, term) { 
     var outCollection = []; 

      switch(term){ 
       case 'today': 
        outCollection = collection; 
        break; 
       case 'before8': 
        angular.forEach(collection, function(item){ 
         if(item.start.getHours() < 8) 
          outCollection.push(item); 
        }); 
        break; 
       case 'after5': 
        angular.forEach(collection, function(item){ 
         var hr = item.end.getHours(); 
         var min = item.end.getMinutes(); 
         if(hr > 17 || (hr == 17 && min > 0)) 
          outCollection.push(item); 
        }); 
        break; 
       default: 
        break; 
      } 

      return outCollection; 
    }; 
}); 

답변

0

각도 모르는 필터 로직이 변경되면, 이것이 근본적인 문제입니다.

업데이트하는 시간은 필터를 다시 계산하는 다른 다이제스트 작업 때문입니다. 내가 가진 최선의 해결책은 필터에서 이런 종류의 로직을 수행하지 않고 각도를 인식하는 범위 변수로 노출시키는 것입니다. 예 : 목록이 있고이 목록의 하위 집합을 범위 변수로 만들고 상황이 바뀔 때 업데이트하십시오.

+0

'filterBy' 변수는 범위가 떨어져 있으므로 변경하면 각도가 변경된다는 가정하에 작동합니다 ... BC라고 생각합니다. 1ngInit을 사용하여 각 행에 대해 새 변수를 선언합니다 .' 어떤 부분이 아닌 범위 – ExceptionLimeCat

+0

필자는 목록에서 데이터의 하위 집합을 작성한 다음 제안한 범위에 첨부했습니다. 감사. – ExceptionLimeCat

관련 문제