Question

如何在角度js中创建第N行后插入一些自定义行。例如在清单项目中有10个对象，我必须在第六行之后添加两个额外的行。

<html>
<table>
  <thead>
    <tr>
      <th>Task</th>
      <th>N/A</th>
      <th>Date Completed</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="item in checklist">
      <td>{{item.taskName}}</td>
      <td>
        <input type="checkbox">
      </td>
      <td>
        <input type="text">
      </td>
    </tr>
  </tbody>
</table>

</html>

Answer 1

使用ng-repeat指令的$ index变量。喜欢： - ＆gt;

<html>
<body>
<table>
  <thead>
    <tr>
      <th>Task</th>
      <th>N/A</th>
      <th>Date Completed</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="item in checklist" ng-if="$index<=6">
      <td>{{item.taskName}}</td>
      <td>
        <input type="checkbox">
     </td>
     <td>
       <input type="text">
     </td>
   </tr>
   <tr>
     <td>&nbsp;</td>
     <td>&nbsp;</td>
     <td>&nbsp;</td>
   </tr>
   <tr>
     <td>&nbsp;</td>
     <td>&nbsp;</td>
     <td>&nbsp;</td>
   </tr>
   <tr ng-repeat="item in checklist" ng-if="$index>6">
     <td>{{item.taskName}}</td>
     <td>
       <input type="checkbox">
     </td>
     <td>
       <input type="text">
     </td>
   </tr>
  </tbody>
</table>
</body>
</html>

Answer 2

请参阅documentation for splice()。它可以在任何给定索引处添加或删除数组中的项。你会想要arrayOfItems.splice(5, 0, addAfter6thItem)

的内容

如何在第N行之后在angular JS中的表中显式添加行？

2 个答案: