ngFor，索引为属性中的值

我有一个简单的ngFor循环，它还可以跟踪当前索引。我想把索引值存储在一个属性中，这样我就可以打印它了。

我基本上有这个：

<ul *ngFor="#item of items; #i = index" data-index="#i">
    <li>{{item}}</li>
</ul>

我想将#I的值存储在属性数据索引中。我尝试了几种方法，但都没有奏效。

我这里有一个演示：http://plnkr.co/edit/EXpOKAEIFlI9QwuRcZqp?p=preview

如何将索引值存储在数据索引属性中？

当前回答

只是对此的更新，Thierry的回答仍然正确，但Angular2在以下方面进行了更新：

<ul *ngFor="let item of items; let i = index" [attr.data-index]="i">
  <li>{{item}}</li>
</ul>

#i=索引现在应该让i=索引

编辑/更新：

*ngFor应该位于要foreach的元素上，因此在本例中应该是：

<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>

edit/更新

角度7/8

<ul *ngFor="let item of items; index as i">
  <li [attr.data-index]="i">{{item}}</li>
</ul>

其他回答

我将使用此语法将索引值设置为HTML元素的属性：

角度>=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>

以下是更新的plunker：http://plnkr.co/edit/LiCeyKGUapS5JKkRWnUJ?p=preview.

试试这个

<div *ngFor="let piece of allPieces; let i=index">
{{i}} // this will give index
</div>

其他答案是正确的，但您可以完全省略[attr.data索引]，只使用

<ul>
    <li *ngFor="let item of items; let i = index">{{i + 1}}</li>
</ul