angular5 *ngFor获取index
2019-07-27 本文已影响3人
侯工
angular 中的*ngFor指令的使用:
<ul>
<li *ngFor="let item in items">{{item}}</li>
</ul>
有时候需要获取index,比如:删除本行 li 列表的时候需要根据 index 来确定删的是哪个
<ul>
<li *ngFor="let item of items; let i = index">
{{item}}
<i (click)="deleteThis(i)">x</i>
</li>
</ul>
private items = ["张三","李四","王五","赵六","李七"];
deleteThis(index){
console.log(index);
this.items.splice(index,1) //根据数组的index来删除对应的元素
}
把列表遍历出来显示到页面,点击每个列表对应的x就可以删除本条记录