Comment envoyer param filtrée à une directive

Question

j'ai une directive carrousel photo comme ça

<mz-photo-carousel items-per-slide=6 
        carousel-data="vm.carouselData"> 
</mz-photo-carousel> 

dans la directive est juste html pour montrer carrousel avec les données transmises

<div uib-carousel active="active" no-wrap="noWrapSlides"> 
    <div uib-slide ng-repeat="slide in vm.carouselData"> 
    .... 
    </div> 
</div> 

Je veux envoyer données filtrées à la directive mz-photo-carrousel comme celui-ci:

<mz-photo-carousel items-per-slide=6 
        carousel-data="vm.carouselData | myFilter:param"> 
</mz-photo-carousel> 

Je ne veux pas filtrer à l'intérieur du directive mz-photo-carousel parce que je veux qu'il reste générique pour ne traiter que les données qu'il obtient.

Answer 1

Le problème est que puisque vous définissez la liaison de données bidirectionnelle à l'attribut array.

référence provenant de la SO Réponse:

SO Answer

Lorsque vous passez travail de filtre à votre directive, angulaire placera une montre sur vos variables emplois. Ainsi, lorsque des tâches sont assignées dans la surveillance de la consigne, est appelée, ce qui déclenche à nouveau le filtrage, et cela continue jusqu'à ce que le cycle de digestion maximum soit atteint par angulaire.

Pour éviter cette situation, vous pouvez créer une méthode de filtrage et transmettre cette méthode dans ng-model. De cette façon, vous pouvez éviter la création de copie et l'erreur de cycle de digestion maximale .

Donc, pour éliminer l'erreur. Utilisez le filtre à l'intérieur de la directive en utilisant le JS ci-dessous. La démo est également fournie.

JSFiddle Demo

JS:

var demo = angular.module('demo', []); 
demo.directive('arrayDisplay', function($parse, $filter){ 
    return { 
     restrict: 'E', 
     replace: true, 
     transclude: false, 
     scope: {array: '=', from: '=', to:'='}, 
     template: '<span>{{array}}<span>after the filter is applied : {{filtered}}</span></span>', 
     link: function(scope, element, attrs){ 
      scope.filtered = $filter('slice')(scope.array, scope.from, scope.to); 
     } 
    } 
}); 

demo.filter('slice', function() { 
    return function(input, from, to) { 
     return input.slice(from, to); 
    }; 
}) 

function MyCtrl ($scope) { 
    $scope.array = [1,2,3,4,5,6,7,8,9,10]; 

};