如何在沒有 Eval() 的情況下在 AngularJS 中過濾多個值？

在AngularJS 中過濾多個值

AngularJS 提供了強大的過濾功能，但是使用邏輯OR 運算子過濾多個值可能會很複雜。讓我們探索如何動態過濾多個值，而不訴諸潛在危險的 eval() 呼叫。

要實現動態多值過濾，我們建議建立自訂過濾器。過濾器很容易創建，並提供了一種安全有效的方法來擴展 AngularJS 的過濾功能。

<code class="javascript">angular.module('myFilters', []).
  filter('bygenre', function() {
    return function(movies, genres) {
      var out = [];
      for (var i = 0; i <p>這個名為「bygenre」的自訂過濾器採用兩個參數：movie（要過濾的資料）和流派（要過濾的流派數組）。該過濾器根據指定的類型檢查每部電影，並傳回僅包含與任何類型相符的電影的新數組。 </p>
<p>在模板中，我們可以像這樣使用此自訂過濾器：</p>
<pre class="brush:php;toolbar:false"><code class="html"><h1 id="Movies">Movies</h1>
<input type="checkbox" ng-model="genrefilters.action">Action
<br>
<input type="checkbox" ng-model="genrefilters.family">Family
<br>{{genrefilters.action}}::{{genrefilters.family}}
<ul>
    <li ng-repeat="movie in movies | bygenre:genrefilters">{{movie.title}}: {{movie.genre}}</li>
</ul></code>

此模板為每個流派建立一個複選框，讓您動態選擇要過濾的流派。當您切換複選框時，影片將被過濾以僅顯示與所選類型相符的影片。

這種方法提供了一種靈活且安全的方法來在 AngularJS 中動態過濾數據，使您可以輕鬆搜尋多個值，而無需損害效能或安全性。

以上是如何在沒有 Eval() 的情況下在 AngularJS 中過濾多個值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！