如何使用ng-if和tr-tag以及ng-repeat?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何使用ng-if和tr-tag以及ng-repeat?相关的知识,希望对你有一定的参考价值。
有人可以帮我吗?下面是我的代码和问题解释。
<table>
<thead>
<tr>
<th>Icon</th>
<th>Name</th>
<th>Details</th>
</tr>
</thead>
<tbody ng-repeat="category in editor.categories">
<tr>
<th>{{category.categoryName}}</th>
</tr>
<tr ng-repeat="feature in category.features"> // Question?
<td>{{feature.iconImg}}</td>
<td>{{feature.featureName}}</td>
<td>{{feature.details}}</td>
</tr>
<tr ng-if="feature.id==1"> // condition 1
</tr>
<tr ng-if="feature.id==2"> // condition 2
</tr>
</tbody>
</table>
现在,让我解释一下这个问题。我有一组类别。每个类别作为一组功能。
现在我的问题是,如何根据ng-if
条件显示每个类别的这些功能。即,条件1的<tr>
只有在feature.id==1
时才会显示,并且只有feature.id==2
才会显示条件2。
问:如何根据不同的条件包含我的ng-if条件?
非常感激您的帮忙。
答案
在一个标签中同时使用ng-if和ng-repeat:
<tr ng-repeat="feature in features"
ng-if="feature.id === 1" >
</tr>
或者,如果要有条件地显示某些模板,可以使用ng-switch,例如:
<tr
ng-repeat="feature in features"
ng-switch="feature.id" >
<span ng-switch-when="1"></span>
<span ng-switch-when="2"></span>
</tr>
另一答案
检查开关和开关时间
https://docs.angularjs.org/api/ng/directive/ngSwitch
问候
以上是关于如何使用ng-if和tr-tag以及ng-repeat?的主要内容,如果未能解决你的问题,请参考以下文章
调整高度Tags Dynamically Generated By ng-if Directive
Angular Radio 默认选择和 ng-if 按钮不起作用
html ng-class和ng-if(ng-class可以包含一个对象,其中key和expression对作为对象,ng-if类似于if语句)