angularjs - 有条件地在 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。

Answer 1

您可以使用 ng-repeat's 通过 ng-repeat-start 和 ng-repeat-end 特殊重复开始和结束点。

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>