AngularJS - Mehrere Filter Verwendung in der Steuerung

Question

Ich möchte

$filter('limitTo')($filter('lowercase')($filter('translate')('ACTIVE')), 5) 

unter Verwendung mehrerer Filter in Controller

Derzeit verwenden Wenn wir weitere Filter wie diese haben. Wie kann ich mehrere Filter im Controller eher konventionelles Format wie dieses verwenden?

Answer 1

Sie können einfach Variablen vorstellen:

var limitTo = $filter('limitTo'); 
var lowercase = $filter('lowercase'); 
var translate = $filter('translate'); 

var filteredValue = limitTo(lowercase(translate('ACTIVE')), 5); 

Oder sogar

var lowercaseStatus = lowercase(translate('ACTIVE')); 
var filteredValue = limitTo(lowercaseStatus, 5); 

Eine andere Strategie wäre die gleiche Syntax wie in der Ansicht zu verwenden:

var filteredValue = $scope.$eval('"ACTIVE" | translate | lowercase | limitTo:5'); 

Answer 2

Dieses eine ist interessante Frage. Normalerweise würde man so etwas oder etwas tun:

var translatedValue = $filter('translate')('ACTIVE'); 
var lowercaseValue = $filter('lowercase')(translatedValue); 
$scope.finalValue = $filter('limitTo')(lowercaseValue, 5) 

Ich habe einen Service von this answer inspiriert.

app.service('FilterChain', 
['$filter', function($filter) { 
    var chain = { 
     value : '', 
     start : function(value) { 
      this.value = value; 
      return this; 
     }, 
     applyFilter : function(filterName, args) { 
      args = args || []; 
      args.unshift(this.value); 
      this.value = $filter(filterName).apply(undefined, args) 
      return this; 
     } 
    }; 

    return chain; 
}]); 

Verwendung ist wie dieser

$scope.value = FilterChain.start('Active') 
       .applyFilter('translate') 
       .applyFilter('limitTo', [5]) 
       .applyFilter('uppercase') 
       .value; 

Sie den Dienst mit anderen Filtern verwenden können und Objekte wie Arrays. Sehen Sie ein Arbeitsbeispiel hier: JSFiddle