1. ホーム
  2. angular

[解決済み] インデックスを属性値とするngFor

2022-03-24 07:21:01

質問

私は、単純な ngFor ループは、現在の index . 私は、その index の値を印刷できるようにします。しかし、これがどのように機能するのかがわかりません。

私は基本的にこれです。

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

の値を格納したい。 #i という属性に data-index . いくつかの方法を試しましたが、どれもうまくいきませんでした。

ここにデモがあります。 http://plnkr.co/edit/EXpOKAEIFlI9QwuRcZqp?p=preview

を格納するにはどうすればよいですか? index の値を data-index 属性は?

どのように解決するのですか?

この構文を使って、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>

以下は、更新されたプランクルです。 http://plnkr.co/edit/LiCeyKGUapS5JKkRWnUJ?p=preview .