AngularJS-refresh ng-répétition

J'utilise ng-repeat pour afficher une collection de valeurs. Mes options de filtre changent en fonction d'un appel ajax au serveur. Comment puis-je actualiser le ng-repeat après la réception des paramètres de filtre?

Js fiddle

Modèle

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

Angulaire

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];      
   }
});
34
demandé sur jkukul 2014-09-15 12:14:52

4 réponses

Vous devez indiquer à angular que les valeurs ont des modifications: 

$scope.loadNewFilter = function (){
    $scope.filter = [1,2,3];      
    $scope.$apply();
}
37
répondu Chris Charles 2014-09-15 08:17:36

Vous avez placé {[0] } hors de portée du contrôleur.

7
répondu Gaurav 2014-09-15 08:20:55

Dans mon cas, j'avais un trackBy dans mon ng-repeat et j'ai dû le supprimer pour le mettre à jour.

5
répondu aoakeson 2016-09-29 22:17:13

Après avoir reçu votre filtre appelé $ scope .$ apply() comme suit: c'est actualiser votre portée.

$scope.$apply(function() {
     // your code
});
1
répondu Mahesh 2014-09-15 08:20:46