AngularJS - refresh ng-repeat

Question

Sto usando ng-repeat per visualizzare un insieme di valori. Le mie opzioni di filtro cambiano in base a una chiamata ajax al server. Come posso aggiornare la ng-repeat dopo aver ricevuto i parametri del filtro?

js fiddle

Template

<div> 
<div data-ng-controller="myCtrl"> 
    <ul> 
     <li data-ng-repeat="item in values | filter:filterIds()"> 
      <code>#{{item.id}}</code> Item 
     </li> 
    </ul> 
    </div> 
</div> 
<button ng-click="loadNewFilter()"> filter now</button> 

angolare

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

app.controller('myCtrl', function ($scope) { 
    $scope.values = [ 
    {id: 1}, 
    {id: 2}, 
    {id: 3}, 
    {id: 4}, 
    {id: 5}, 
    {id: 6} 
    ]; 

    $scope.filter = [1,2,3,4,5,6]; 

    $scope.filterIds = function (ids) { 
     return function (item) { 
      var filter = $scope.filter; 
      return filter.indexOf(item.id) !== -1;   
     } 
    } 

    $scope.loadNewFilter = function(){ 
    $scope.filter = [1,2,3];  
    } 
}); 

Answer 1

Dovete dire angolare che i valori hanno cambiamenti:

$scope.loadNewFilter = function(){ 
    $scope.filter = [1,2,3];  
    $scope.$apply(); 
} 

Answer 2

Dopo aver ricevuto il filtro chiamato $ scope. $ Apply() come segue: Aggiorna l'ambito.

$scope.$apply(function() { 
    // your code 
}); 

Answer 3

Hai messo <button ng-click="loadNewFilter()"> filter now</button> fuori portata controllore.

Answer 4

Nel mio caso ho avuto una traccia nella mia ng-repeat e ho dovuto rimuoverla per farlo aggiornare.