Heim >Web-Frontend >js-Tutorial >Wie filtere ich mehrere Werte mit ODER-Verknüpfung in AngularJS?

Wie filtere ich mehrere Werte mit ODER-Verknüpfung in AngularJS?

Barbara Streisand
Barbara StreisandOriginal
2024-11-02 13:08:02685Durchsuche

How to Filter Multiple Values with OR Operation in AngularJS?

Filtern mehrerer Werte mit ODER-Verknüpfung in AngularJS

AngularJS bietet einen leistungsstarken Filtermechanismus, mit dem Sie Daten nach bestimmten Kriterien filtern können. Das Filtern nach mehreren Werten mithilfe der vereinfachten ODER-Operation kann jedoch eine Herausforderung sein.

Stellen Sie sich vor, Sie haben ein Objekt, das einen Film mit der Eigenschaft „Genres“ darstellt. Um nach Filmen im Genre „Action“ oder „Komödie“ zu filtern, könnten Sie versucht sein, einen Filterausdruck wie diesen zu verwenden:

{genres: 'Action'} || {genres: 'Comedy'}

Dieser Ansatz funktioniert jedoch nicht für die dynamische Filterung. Angenommen, Sie möchten basierend auf einem Array von Genres filtern, die in $scope.genresToFilter gespeichert sind. In diesem Fall benötigen Sie eine flexiblere Lösung.

Erstellen eines benutzerdefinierten Filters

Die bevorzugte Lösung besteht darin, einen benutzerdefinierten AngularJS-Filter zu erstellen. So können Sie es machen:

angular.module('myFilters', []).filter('bygenre', function() {
  return function(movies, genres) {
    var out = [];
    // Implement your filtering logic here
    return out;
  }
});

Verwenden Sie in Ihrer HTML-Vorlage Ihren benutzerdefinierten Filter wie folgt:

<ul>
  <li ng-repeat="movie in movies | bygenre:genresToFilter">{{movie.title}}: {{movie.genre}}</li>
</ul>

Jetzt können Sie genresToFilter dynamisch ändern, um die angezeigten Filme basierend zu filtern auf die gewünschten Genres. Dieser Ansatz ist viel vielseitiger als die Verwendung eines statischen Filterausdrucks.

Das obige ist der detaillierte Inhalt vonWie filtere ich mehrere Werte mit ODER-Verknüpfung in AngularJS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn