Erzwingen benutzerdefinierten Filter in der Wiederholung arbeiten

Question

Ich brauche Filter in meiner Schleife. Nehmen wir an, wir haben ein einfaches Array mit Namen: ['Thomas', 'Brian', 'Joana']. Ich möchte den gefilterten Satz von Namen anzeigen. Es funktioniert wie erwartet, wenn ich Angular des Filters verwenden:

<input ng-model="filterText" /> 
<span ng-repeat="name in names | filter:filterText">{{name}}</span> 

aber wenn ich einige benutzerdefinierte Filter-Methode verwenden möchten, ist es nicht funktioniert, wenn der Wert von ‚filterText‘ Eingang wird geändert:

<input ng-model="filterText" /> 
<span ng-repeat="name in names | filter:filterMethod">{{name}}</span> 

In js-Datei:

$scope.filterMethod = function(item) { 
    if ($scope.textFilter==item || $scope.textFilter==null) { 
    return true; 
    } 
    return false; 
} 

ich möchte auf Liste Filterwirkung zwingen, alle Tage von Namen, wenn der Benutzer ändern ‚filterText‘ eingegeben wird, aber tatsächlich diese Liste geändert wird, nur dann, wenn es durch Angular vordefinierten Filter gefiltert wird. Komplettes plnkr Beispiel: plnkr

Answer 1

Implementieren Sie die benutzerdefinierten Filter wie diese

$scope.filterMethod = function(name) { 
    return function(item){ 
     if(!name) return item; 

     if (name && item.startsWith(name)) { 
     return item; 
     } 
    } 
} 

und ändern in dem HTML-Code die Filter nennen wie diese

<span ng-repeat="name in result = (names | filter:filterMethod(filterText))"> 

angular.module("app",[]) 
 
.controller("ctrl",function($scope){ 
 

 
$scope.names = ['Thomas', 'Brian', 'Joana']; 
 

 
$scope.filterMethod = function(name) { 
 
return function(item){ 
 
    if(!name) return item; 
 
    
 
    if (name && item.startsWith(name)) { 
 
    return item; 
 
    } 
 
} 
 
} 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
<input ng-model="filterText" /> 
 
<span ng-repeat="name in result = (names | filter:filterMethod(filterText))"> 
 
{{name}} 
 
</span> 
 
</div>

Answer 2

Sie müssen wahrscheinlich benutzerdefinierte Filter:

.filter('customFilter', function() { 
    return function(items, searchText) { 
    var filtered = []; 
    //logic 
    return filtered; 
    } 
}); 

<span ng-repeat="name in names | customFilter:text">{{name}}</span> 

Answer 3

ändern $scope.textFilter zu $scope.filterText

$scope.filterMethod = function(item) { 
    if ($scope.textFilter==item || $scope.textFilter==null) { 
    return true; 
    } 
    return false; 
} 

Hier ist eine Gabel auf Ihre plunkr

http://plnkr.co/edit/a3uSyez0VFGbZ5ZARcu7?p=preview