如何使用 AngularJS 過濾器過濾多個值？

使用 AngularJS 過濾器過濾多個值

在 AngularJS 中，您可以利用過濾器來細化數據，例如根據多種類型選擇電影。如果您有一個帶有類型屬性的物件結構，您可能想要過濾屬於“動作”或“喜劇”類型的電影。

自訂過濾器方法

考慮建立自訂過濾，相對簡單。如下定義過濾器：

<code class="javascript">angular.module('myFilters', []).
  filter('bygenre', function() {
    return function(movies, genres) {
      var out = [];
      // Implement your filtering logic here, adding matches to the out variable.
      return out;
    }
  });</code>

模板用法

在模板中，您可以像這樣合併自訂過濾器：

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

動態過濾器變數

要根據範圍內的流派數組動態過濾，您可以如下設定variableX變數：

<code class="javascript">$scope.variableX = {genres: ['Action', 'Comedy']};</code>

這可讓您根據陣列中的值動態套用篩選器.

範例

這是一個示範此方法的小提琴範例：https://jsfiddle.net/s39pazfg/

以上是如何使用 AngularJS 過濾器過濾多個值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！