Javascript 是否仍要在表中显示序列号？

我现在是新的angular，所以如果我的实现中有任何错误，请让我知道

这是我的HTML代码，来自component.HTML文件

<table id="table">
   <tr>
     <th>Sl.No.</th>
     <th>Name</th>
     <th>Email</th>
     <th>Phone Number</th>
     <th>Skill</th>
     <th>Gender</th>
   </tr>
   <tr *ngFor = " let i of counter()">
     <td></td> <!-- To print the serial number here -->
     <td>{{nameFromLocalStorage}}</td>
     <td>{{emailFromLocalStorage}}</td>
     <td>{{phoneFromLocalStorage}}</td>
     <td>{{skillFromLocalStorage}}</td>
     <td>{{genderFromLocalStorage}}</td>
     <td>
       <button (click)="delete()" ><img src="./assets/icon/trash.png"></button>
     </td>
   </tr> 
</table>

counter() {
    //TO DO
    //Implementation is remaining,
    return new Array(20);
  }

计数器应该返回一个值，该值由

*ngFor

指令中的html文件捕获，并基于此创建所需的行数。然后我想在表的第一列显示序列号

根据上面的代码，我可以得到20行

注意：-我已经在CSS中看到了解决方案，在它成为唯一选项之前不希望实现

我的问题是如何在那里获得序列号

根据我的理解，

*ngFor

指令中的

i

应该从零开始，因此，是否存在直接显示

i

自身值的方法

如果你能帮助我学习并改正我的错误，我将非常高兴

---

提前谢谢。

是的，您可以简单地循环它。不知道您的序列号是什么，如果它来自阵列，则只需使用

计数器阵列。序列号

 <tr *ngFor = " let CounterArr of counter();let i = index;">
     <td>{{i+1}}</td> 
     <td>{{CounterArr.nameFromLocalStorage}}</td>
     <td>{{CounterArr.emailFromLocalStorage}}</td>
     <td>{{CounterArr.phoneFromLocalStorage}}</td>
     <td>{{CounterArr.skillFromLocalStorage}}</td>
     <td>
       <button (click)="delete()" ><img src="./assets/icon/trash.png"></button>
     </td>
   </tr> 

{{i+1}}
{{counterar.nameFromLocalStorage}}
{{counterar.emailFromLocalStorage}}
{{counterar.phoneFromLocalStorage}
{{counterar.skillFromLocalStorage}

Duplicate:谢谢，它成功了。