Число таблиц

Question

Скажите, пожалуйста, как писать в Angular 2 some @Pipe или функцию для добавления последовательного числа в таблицу? это часть моего шаблона:

<table class="table table-bordered table, table table-hover"> 
     <thead> 
      <tr> 
       <td colspan="12" align="center">none</td> 
      </tr> 
      <tr> 
       <th>consecutive number</th> 
       <th>none</th> 
       <th>none</th> 
      </tr> 
      <tr style="background: #F5F5F5"> 
       <td></td> 
       <td></td> 
       <td></td> 
      </tr> 
     </thead> 
     <tfoot> 
      <tr> 
       <td colspan="8"></td> 
       <td colspan="2">none: none</td> 
       <td colspan="2">none: none</td> 
      </tr> 
     </tfoot> 
     <tbody> 
      <template ngFor let-list [ngForOf]="lists"> 
       <tr> 
        <td></td> 
        <td>{{ list.name }}</td> 
        <td>{{ list.location }}</td> 
       </tr> 
       <div [hidden]="!list.isVisible"> 
        <br> 
        <table> 
         <thead> 
          <tr> 
           <th>none</th> 
           <th>none</th> 
           <th>none</th> 
          </tr> 
         </thead> 
         <tbody> 
          <tr *ngFor="let new_var of list.hops"> 
           <td>{{ new_var.hop_type }}</td> 
           <td>{{ new_var.hop_text }}</td> 
           <td>{{ new_var.id_sl_hop }}</td> 
          </tr> 
         </tbody> 
        </table> 

Я хотел бы добавить порядковый номер в <th>consecutive number</th>, и добавить @Pipe или другую функцию в <td>...<td>, как *ngFor директивы, или что-то другое.

Answer 1

Вы можете использовать индекс для получения последовательных номеров, что-то вроде этого. Индекс начинается с 0, так что вы можете иметь индекс + 1.

<tr *ngFor="let item of rows; let i= index"> 
    <td> {{i+1}} </td> 
    <td> {{item.name}} </td> 
</tr> 

В вашем случае это должно быть

<template ngFor let-list [ngForOf]="lists" let-i="index"> 

</template>