【问题标题】:Hide parent block when child element is not present while searching in searchbox在搜索框中搜索时,当子元素不存在时隐藏父块
【发布时间】:2018-06-16 07:52:38
【问题描述】:
在搜索框中搜索时,如果子元素不存在,如何隐藏父元素。这是我的代码:
<div class="col-md-6" ng-repeat="round in displaymatch.allrounds>
<h3>Round: {{round.name}}</h3>
<div ng-repeat="teamname in round.matches | filter:namesearch">
<b>Match Date:</b> {{teamname.date}}
<a ng-href="#!/15/{{teamname.date}}/{{teamname.team1.code}}/{{teamname.team2.code}}">{{teamname.team1.name}} <strong>V/S</strong>
{{teamname.team2.name}}</a>
</div>
元素的正常搜索正在工作,但搜索不存在的关键字也应该隐藏主要块(轮)。
正常功能:
这是我面临的问题:
【问题讨论】:
标签:
javascript
angularjs
angularjs-ng-repeat
ng-hide
angularjs-ng-show
【解决方案1】:
使用ng-show 仅在过滤后有 >0 个匹配项时显示标题:
<div class="col-md-6" ng-repeat="round in displaymatch.allrounds>
<h3 ng-show="(round.matches | filter:namesearch).length > 0">Round: {{round.name}}</h3>
<div ng-repeat="teamname in round.matches | filter:namesearch">
<b>Match Date:</b> {{teamname.date}}
<a ng-href="#!/15/{{teamname.date}}/{{teamname.team1.code}}/{{teamname.team2.code}}">{{teamname.team1.name}} <strong>V/S</strong>
{{teamname.team2.name}}</a>
</div>
类似于this 的回答。