AngularJS - 사용자 정의 필터, 모델이보기에서 업데이트되지 않습니다.

사용자가 확인란을 클릭 할 때 트리거되는 사용자 정의 필터가 있습니다. 지시문을 사용하여 DOM 요소를 렌더링하고 확인란을 클릭하면 수신자가 $scope에 노출 된 filter 함수를 트리거하는 수신기를 연결합니다.AngularJS - 사용자 정의 필터, 모델이보기에서 업데이트되지 않습니다.

보기에 사용 된 은 필터 기능의 결과로 덮어 써야하고 반환 객체는 괜찮습니다 (예 : console.log()).보기가 업데이트되지 않습니다. 내가 도대체 뭘 잘못하고있는 겁니까?

http://jsfiddle.net/r3pXc/1/

보기 :

<body ng-app="app"> 

<div ng-controller="mainCtrl"> 
    <div list-directive /> 
</div>

템플릿 :

<script type="text/ng-template" id="list.html"> 
    <input type="checkbox" class="control"> 

    <div ng-repeat="player in model"> 
     Name: {{player.firstName}}, Price: {{player.price}} 
    </div> 
</script>

모듈 및 컨트롤러 :

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

app.controller('mainCtrl', ['$scope', '$filter', function($scope, $filter){ 
    $scope.model = [{ firstName: 'foo', price: 100 }, { firstName: 'bar', price: 50 }, { firstName: 'foobar', price: 0}]; 

    $scope.filter = function() { 
     $scope.model = $filter('listFilter')($scope.model); 
     console.log($scope.model); 
    } 
}]);

이 지침 :

app.directive('listDirective', function(){ 
    return { 
     restrict: 'AE', 
     templateUrl: 'list.html', 
     link: function($scope, iElm, iAttrs, controller) { 
      iElm.bind('click', function(e){ 
       var el = angular.element(e.target); 

       if (el.hasClass('control')) { 
        $scope.filter(); 
       }; 
      }); 
     } 
    }; 
});

그리고 필터 : 내가 가진 요소에 듣지 않기 때문에

app.filter('listFilter', function(){ 
    return function(input) { 
     var results = []; 

     angular.forEach(input, function(val, key){ 
      if (val.price != 0) { 
       results.push(val); 
      } 
     }); 

     return results; 
    } 
});

출처

2014-04-11 Ozrix

-1

가 수동으로 $apply()와 다이제스트주기를 호출 할 필요가 ng- 이벤트 핸들러 :

$scope.filter = function() { 
    $scope.model = $filter('listFilter')($scope.model); 
    $scope.$apply(); 
}

출처

2014-04-11 21:01:40 Ozrix

AngularJS - 사용자 정의 필터, 모델이보기에서 업데이트되지 않습니다.

답변

관련 문제