在属性中将索引作为值的ngFor
在属性中将索引作为值的ngFor
提问于 2016-02-15 17:27:57
我有一个简单的ngFor循环，它也可以跟踪当前的index。我希望将该index值存储在一个属性中，以便可以打印它。但我搞不懂这是怎么回事。
我基本上有这样的想法：
<ul *ngFor="#item of items; #i = index" data-index="#i">
<li>{{item}}</li>
</ul>我想在属性data-index中存储#i的值。我尝试了几种方法，但都不管用。
我这里有一个演示：http://plnkr.co/edit/EXpOKAEIFlI9QwuRcZqp?p=preview
如何在data-index属性中存储index值？
回答 6
Stack Overflow用户
回答已采纳
发布于 2016-02-15 17:29:23
我将使用以下语法将索引值设置为HTML元素的属性：
Angular >= 2
您必须使用let而不是#来声明该值。
<ul>
<li *ngFor="let item of items; let i = index" [attr.data-index]="i">
{{item}}
</li>
</ul>角度=1
<ul>
<li *ngFor="#item of items; #i = index" [attr.data-index]="i">
{{item}}
</li>
</ul>下面是更新后的版本：http://plnkr.co/edit/LiCeyKGUapS5JKkRWnUJ?p=preview。
Stack Overflow用户
发布于 2016-06-28 17:23:52
这只是一个更新，蒂埃里的答案仍然是正确的，但Angular2有一个关于以下方面的更新：
<ul *ngFor="let item of items; let i = index" [attr.data-index]="i">
<li>{{item}}</li>
</ul>现在，#i = index应为let i = index
编辑/更新：
*ngFor应该在您想要访问的元素上，因此对于本例，它应该是：
<ul>
<li *ngFor="let item of items; let i = index" [attr.data-index]="i">{{item}}</li>
</ul>编辑/更新
角度5
<ul>
<li *ngFor="let item of items; index as i" [attr.data-index]="i">{{item}}</li>
</ul>EDIIT/更新
Angular 7/8
<ul *ngFor="let item of items; index as i">
<li [attr.data-index]="i">{{item}}</li>
</ul>Stack Overflow用户
发布于 2016-07-26 04:49:49
我想这个问题以前已经回答过了，但这只是一个更正，如果你正在填充一个无序列表，*ngFor将会出现在你想要重复的元素中。所以它应该是insdide <li>。此外，Angular2现在使用let来声明变量。
<ul>
<li *ngFor="let item of items; let i = index" [attr.data-index]="i">
{{item}}
</li>
</ul>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/35405618
复制相关文章
相似问题