[解決済み] インデックスを属性値とする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 .
関連
-
[解決済み] 現在のルートを取得する方法
-
[解決済み] オブジェクトのキーと値に*ngForでアクセスする
-
[解決済み] Angularのエラーです。"Can't bind to 'ngModel' because it isn't a known property of 'input'"."
-
[解決済み】*ngIfと*ngForが同じ要素にあるとエラーになる件
-
[解決済み] AngularのINPUT要素でngModel内のパイプを使用する
-
[解決済み] Angular - "has no exported member 'Observable'" エクスポートされたメンバーがありません。
-
[解決済み] index.tsは何に使われているのですか?
-
[解決済み] AngularでngFor repeatをある数のアイテムに制限するにはどうすればよいですか?
-
[解決済み] Angular 2 - モデル変更後、ビューが更新されない
-
[解決済み] Angular 2のテンプレートでlet-*とは何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Angular 4: パイプ 'AsyncPipe' に対する InvalidPipeArgument: '[object Object]' です。
-
[解決済み] Angular [disabled]="MyBoolean "が動作しない。
-
[解決済み] Angular 2の "select "で新しい選択範囲を取得するにはどうすればよいですか?
-
[解決済み] Angular CLI Error: serveコマンドはAngularプロジェクトで実行する必要がありますが、プロジェクト定義が見つかりませんでした。
-
[解決済み] Angular + Material - データソース(mat-table)を更新する方法
-
[解決済み] AngularのINPUT要素でngModel内のパイプを使用する
-
[解決済み] ナンバーパイプ - Angular 2のパラメータは?
-
[解決済み] テンプレート内の *ngIf else if
-
[解決済み] Angular 2の無効化されたコントロールがform.valueに含まれない
-
[解決済み] 複数のng-content