Angular.js ng-repeat 跨多个 tr [英] Angular.js ng-repeat across multiple tr's

查看:28
本文介绍了Angular.js ng-repeat 跨多个 tr的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在将 Angular.js 用于一个应用程序,该应用程序使用隐藏的 trs 通过在下面的 td 中显示 tr 和向下滑动 div 来模拟滑出效果.在迭代这些行的数组时,这个过程使用knockout.js 非常有效,因为我可以在两个tr 元素周围使用<!-- ko:foreach -->.

对于 angular,ng-repeat 必须应用于 html 元素,这意味着我似乎无法使用标准方法重复这些双行.我对此的第一个反应是创建一个指令来表示这些双 trs,但由于指令模板必须具有单个根元素,因此没有达到,但我有两个 (<tr></tr><tr></tr>).

如果任何有 ng-repeat 和 angular 经验的人可以解释如何解决这个问题,我将不胜感激.

(我还应该注意将 ng-repeat 附加到 tbody 是一个选项,但这会产生多个 tbody,我假设这是标准 HTML 的错误形式,尽管如果我错了)

解决方案

tbody 上使用 ng-repeat 似乎是有效的,参见 这篇文章.

另外一个通过 html 验证器 的快速测试允许多个 tbody 元素在同一张桌子.

更新:至少从 Angular 1.2 开始,有一个 ng-repeat-startng-repeat-end 允许重复一个系列元素.请参阅文档了解更多信息,感谢@Onite 的评论!>

I am using Angular.js for an application that uses hidden trs to simulate a sliding out effect by showing the tr and sliding down the div in the td below. This process worked fantastically using knockout.js when iterating over an array of these rows, because I could use <!-- ko:foreach --> around both tr elements.

With angular, ng-repeat must be applied to an html element, meaning I cannot seem to repeat these double rows using standard methods. My first response to this was to create a directive to represent these double trs, but that fell short because directive templates must have a single root element, but I have two (<tr></tr><tr></tr>).

If anyone with experience with ng-repeat and angular who has cracked this can explain how to solve this problem, I would be greatly appreciative.

(I should also note that attaching ng-repeat to the tbody is an option, but this produces multiple tbodys, and I am assuming that is bad form for standard HTML, although correct me if I'm wrong)

解决方案

Using ng-repeat on tbody appears to be valid see this post.

Also a quick test through an html validator allowed multiple tbody elements in the same table.

Update: As of at least Angular 1.2 there is an ng-repeat-start and ng-repeat-end to allow repeating a series of elements. See the documentation for more information and thanks to @Onite for the comment!

这篇关于Angular.js ng-repeat 跨多个 tr的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆