我正在努力与一个特殊的用例.我在底部提供了一个jsfiddle代码段.
HTML表格
我的HTML是一个表. ng-repeat指令必须应用于html元素.在我的用例中,这不能完成,因为ng-repeat的一个实例由double tr元素组成：
<!-- ng-repeat the following block n times --> <tr> <td>text</td> </tr> <tr> <td tooltip="comment that is bound to the first tr">hover me</td> </tr>
AngularJS不提供语法重复注释(不同于KnockoutJS).我在SO上发现了类似的问题.然而,用例包括在元素中附加HTML.我的矿将包括在ng重复的tr之后放置一个新的tr,但它没有起作用.此外,还有一个新的东西要考虑到.
2.工具提示指令
第二个tr嵌入一个工具提示指令,该指令取自角度引导.因此,纯粹的jQuery方法可能不可行.
我的目标
我向您提供一个不使用ng-repeat的代码段.我的目标是使用ng-repeat应用于我的集合的每个元素.
您可以使用tbody标签将多个tr组合在一起,并使用ngRepeat来循环.
原文链接：https://www.f2er.com/angularjs/143244.html<div ng-app="challenge">
<h3>how can I refactor it out using ng-repeat?</h3>
<table ng-controller="ctrl">
<thead></thead>
<tbody ng-repeat="item in collection">
<tr ng-click="showing=!showing">
<td>click</td>
<td>{{item}}</td>
</tr>
<tr ng-show="showing">
<td>--></td>
<td>comment {{item}}
<a tooltip="a tooltip comment {{item}}">
<i class="icon-ok-sign"></i>
</a>
</td>
</tr>
</tbody>
</table>
</div>
顺便说一句,看起来你的代码仍然是Jquery的做事方式.即使你把它们放在一个指令中.如上面的示例所示,根本不需要一个指令,并且不使用JQuery.
