为什么此过滤器无法正常工作？

Non 发表于 Dev

非

我的过滤器行为异常。

这种方式仅适用于1数组，无法通过搜索 leagues.name

<input type="text"
       ng-model="query">

<div ng-repeat="sport in sportsFilter = (sports | filter:query)">
   <strong>
     {{sport.name}}
   </strong>
   <div ng-repeat="league in sport.leagues | filter:query"
        on-tap="goToLines(league)">
        {{league.name}}
   </div>
</div>

如果我|filter:query从第二个删除，没关系ng-repeat

这种方式仅适用于第二个数组： leagues.name

<div ng-repeat="sport in sportsFilter = (sports | filter:query)">
     <strong>
       {{sport.name}}
     </strong>

    <input type="text"
           ng-model="query">

      <div ng-repeat="league in sport.leagues | filter:query">
        {{league.name}}
      </div>
</div>

因此，我的问题是，为什么必须更改输入的位置才能使其正常工作？

为了使它可以同时在两个阵列上使用，我该怎么办？

忍者拉比

这个对我有用。请注意，您正在使用相同的query参数来过滤sports和sport.leagues。这是我的工作示例（通过单词“ soccer”进行过滤以从两者中获取结果）：

js：

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.sports = [{name: 'soccer', leagues: [{name: 'american league'}, {name: 'english league'}, {name: 'world soccer league'}]}]
});

的HTML：

<body ng-controller="MainCtrl">
  <input type="text" ng-model="query">
  <div ng-repeat="sport in sportsFilter = (sports | filter:query)">
    <strong>
      {{sport.name}}
    </strong>
    <div ng-repeat="league in sport.leagues | filter:query" on-tap="goToLines(league)">
      {{league.name}}
     </div>
  </div>    
</body>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。