有条件地在 ng-repeat 中添加行

Question

我在 AngularJS 中有一个简单的重复表行

<tr ng-repeat="item in items">
    <td>{{ item.prop1 }}</td>
    <td>{{ item.prop2 }}</td>
</tr>

我的item 对象上有一个comment 属性，如果该注释包含一个值，我想在其余元素之后的行中单独显示该值并让它跨越整行。这种事情可能吗？我查看了 ng-repeat-end 但这似乎不是我想要的，我不能在 ng-repeat 中添加额外的

元素，因为那将是无效的 HTML。

【问题讨论】：

• 这比看起来更难！
• 谁在投反对票。留下评论回答有什么问题
• 我不明白你为什么不想要ng-repeat-end，就像我在你的整个帖子中读到的那样，这将是最可能的解决方案。

Answer 1

您可以通过ng-repeat-start 和ng-repeat-end 使用ng-repeat's 特殊的重复起点和终点。

DEMO

HTML

<table ng-controller="PostController">
  <tr ng-repeat-start="post in posts">
    <td>{{post.content}}</td>
  </tr>
  <tr ng-repeat-end ng-repeat="comment in post.comments">
    <td>{{comment.content}}</td>
  </tr>
</table>

更新：如果评论是一个字符串，那么只需删除 ng-repeat-end 端点处的 ng-repeat 并添加一个 ng-if 表达式来验证 post.comment 的存在。

DEMO

HTML

<table ng-controller="PostController">
  <tr ng-repeat-start="post in posts">
    <td>{{post.content}}</td>
  </tr>
  <tr ng-repeat-end ng-if="post.comment">
    <td>{{post.comment}}</td>
  </tr>
</table>