AngularJS - refresh ng-repeat

Question

Ich benutze ng-repeat um eine Sammlung von Werten anzuzeigen. Meine Filteroptionen ändern sich entsprechend einem Ajax-Aufruf an den Server. Wie kann ich die ng-Wiederholung aktualisieren, nachdem die Filterparameter empfangen wurden?

js fiddle

Vorlage

<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> 

Angular

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

Sie müssen Winkel sagen, dass die Werte haben Änderungen:

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

Answer 2

Nach dem Empfang Ihres Filters namens $ scope. $ Apply() wie folgt: Es ist Ihren Bereich zu aktualisieren.

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

Answer 3

Sie haben <button ng-click="loadNewFilter()"> filter now</button> aus Steuerungsbereich platziert.

Answer 4

In meinem Fall hatte ich einen TrackBy in meiner ng-Wiederholung und musste es entfernen, um es zu aktualisieren. Kein