Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Menapis Berbilang Nilai dengan Operasi OR dalam AngularJS?

Bagaimana untuk Menapis Berbilang Nilai dengan Operasi OR dalam AngularJS?

Barbara Streisand
Lepaskan: 2024-11-02 13:08:02
asal
682 orang telah melayarinya

How to Filter Multiple Values with OR Operation in AngularJS?

Menapis Berbilang Nilai dengan Operasi OR dalam AngularJS

AngularJS menyediakan mekanisme penapisan berkuasa yang membolehkan anda menapis data berdasarkan kriteria tertentu. Walau bagaimanapun, menapis berbilang nilai menggunakan operasi ATAU yang dipermudahkan boleh menjadi satu cabaran.

Bayangkan anda mempunyai objek yang mewakili filem dengan sifat "genre". Untuk menapis filem sama ada dalam genre "Aksi" atau "Komedi", anda mungkin tergoda untuk menggunakan ungkapan penapis seperti:

{genres: 'Action'} || {genres: 'Comedy'}
Salin selepas log masuk

Walau bagaimanapun, pendekatan ini tidak akan berfungsi untuk penapisan dinamik. Katakan anda ingin menapis berdasarkan tatasusunan genre yang disimpan dalam $scope.genresToFilter. Dalam kes itu, anda memerlukan penyelesaian yang lebih fleksibel.

Mencipta Penapis Tersuai

Penyelesaian pilihan ialah mencipta penapis AngularJS tersuai. Begini cara anda boleh melakukannya:

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

Dalam templat HTML anda, gunakan penapis tersuai anda seperti berikut:

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

Kini, anda boleh menukar genreToFilter secara dinamik untuk menapis filem yang dipaparkan berdasarkan pada genre yang dikehendaki. Pendekatan ini jauh lebih serba boleh daripada menggunakan ungkapan penapis statik.

Atas ialah kandungan terperinci Bagaimana untuk Menapis Berbilang Nilai dengan Operasi OR dalam AngularJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan