javascript - Angular : show a message when no results in angular ng-repeat ?(具体情况)

Question

这个问题已经有答案了:

Angular.js. How to count ng-repeat iterations which satisfy the custom filter (4 个回答)

已关闭 8 年前。

我有一个特定的情况，我在 Accordion 中重复我的数据，我所需要的只是当过滤器(搜索框)在 ng-repeat="sport in sports" 上没有返回任何内容时向用户显示一条消息。

<input ng-model="query" placeholder="Search sports...">
   <accordion close-others="false">
       <accordion-group ng-repeat="sport in sports | filter:query"
                        ng-show="sport.leagues.length">
         <accordion-heading>
           <div ng-click="addSportToLines(sport);">
              {{::sport.name}}
           </div>
          </accordion-heading>
          <div class="list-group leagues-margin">
           <a href="javascript:void(0);" class="list-group-item"
              ng-repeat="league in sport.leagues"
              ng-class="{active: league.active}"
              ng-click="addLeagueToLines(league)">{{::league.name}}
           </a>
         </div>
       </accordion-group>
     </accordion>

Answer 1

试试这个，

<div ng-show="!(sports | filter:query).length">No items</div>

或者，我们可以通过将过滤结果分配给另一个变量来消除另一个过滤器，如下所示，

<accordion close-others="false">
       <accordion-group ng-repeat="sport in filteredSports = (sports | filter: query)"
                        ng-show="sport.leagues.length">
         <accordion-heading>
           ...
       </accordion-group>
     </accordion>

<div ng-show="!filteredSports.length">No items</div>

谢谢。