web-dev-qa-db-de.com

Wie schreibe ich einen anglejs-Filter, um nach Fragmenten/Sequenzen von Strings zu suchen?

Ich versuche, einen benutzerdefinierten Winkeljs-Filter zu schreiben, der prüft, ob ein Array von Ländern eine vom Benutzer eingegebene Suchzeichenfolge enthält. 

Die Zeichenfolge kann aus einem Buchstaben (z. B. 'E') oder einem Fragment von n-Buchstaben (z. B. 'lan') oder einem ganzen Wort (z. B. 'England') bestehen. 

In jedem Fall sollten alle Länder, die diesen einen Buchstaben oder dieses Fragment enthalten, zurückgegeben werden, so dass "E" "England", "Estland" usw. zurückgibt, während "LAN" "England", "Irland" usw.

Bisher hat mein Filter das gesamte Land oder einzelne Buchstaben zurückgegeben, aber ich habe Schwierigkeiten mit String-Fragmenten:

  1. HTML-Vorlage:

    <input ng-model="filter.text" type="search" placeholder="Filter..."/>

<ul>
   <li ng-repeat="item in data | listfilter:filter.text">
</ul>

  2. angleJS

    angular.module('sgComponents').filter('listfilter',[ function () {
return function(items, searchText) {
    var filtered = [];            

    angular.forEach(items, function(item) {
        if(item.label === searchText) { // matches whole Word, e.g. 'England'
            filtered.Push(item);
        }
        var letters = item.label.split('');
        _.each(letters, function(letter) {
            if (letter === searchText) { // matches single letter, e.g. 'E'
                console.log('pushing');
                filtered.Push(item);
            }
        });
        // code to match letter fragments, e.g. 'lan'
    });
    return filtered;
};
}]);
javascriptarraysangularjssearchfilter
15
Tone

Es ist viel einfacher als das, verwenden Sie die Funktion String.indexOf():

angular.forEach(items, function(item) {
    if( item.label.indexOf(searchText) >= 0 ) filtered.Push(item);
});

Sie können beide Strings .toLowerCase() drehen, um zwischen Groß- und Kleinschreibung zu unterscheiden:

searchText = searchText.toLowerCase();
angular.forEach(items, function(item) {
    if( item.label.toLowerCase().indexOf(searchText) >= 0 ) filtered.Push(item);
});
25
Nikos Paraskevopoulos
angular.module('sgComponents').filter('listfilter',[ function () {
    return function(items, searchText) {
        var filtered = []; 
        var regex = new RegExp(".*" + searchItem + ".*", "ig");
        angular.forEach(items, function(item) {
            if(regex.test(item)){
                filtered.Push(item);
            }
        });
        return filtered;
    }
}]);
7
Manoj Nama

Schauen Sie sich die Angular-UI-Bootstrap-Direktive für typeahead an, die genau das macht, was Sie wollen: http://angular-ui.github.io/bootstrap/#/typeahead

0
m.e.conroy