ngFor with index作為屬性中的值

2021-10-02 09:53:58 字數 1243 閱讀 9400

我有乙個簡單的ngfor迴圈,它也跟蹤當前index。 我想將該index值儲存在屬性中,以便我可以列印它。 但我無法弄清楚它是如何工作的。

我基本上有這個:

我想在屬性data-index儲存#i的值。 我嘗試了幾種方法,但沒有一種方法有效。

我在這裡有乙個演示: http : = preview

如何將index值儲存在data-index屬性中?

我會使用此語法將索引值設定為html元素的屬性:

你必須使用let來宣告值而不是#

這是更新的plunkr: http : = preview。

僅僅是對此的更新,thierry的答案仍然是正確的,但angular2已經對以下內容進行了更新:

#i = index現在應該是let i = index

*ngfor應該在你想要的元素上,所以對於這個例子它應該是:

angular 5

ediit / update

angular 7/8

我認為它之前已經得到了回答,但如果你填充無序列表只是乙個修正,*ngfor會出現在你要重複的元素中。 所以它應該是insdide。 此外,angular2現在使用let來宣告變數。

其他答案是正確的,但您可以完全省略[attr.data-index]並使用

在舊版本中

angular.io▸api▸ngforof

單元測試示例

另乙個有趣的例子

試試這個

} // this will give index

of介詞短語作定語 of介詞短語作表語

1.介詞短語作表語和做地點狀語的區別是什麼 一 介詞短語作表語 1 介詞短語作表語,放在連系動詞之後。表明主語的 樣子 所謂的聯絡動詞,就是起到聯絡主語和表語的動詞,比如 he looks ill.中,ill 就是表語,表明主語生病的 樣子 looks 就是聯絡動詞,聯絡主語 he 和表語 ill。...

dhcp authoritative引數作用

遇到過這樣乙個問題,手機作為熱點,用筆記本去連線 始終處於分配ip階段,而其它大多數機器又是可以的。最後調查發現是authoritative缺失,導致客戶端長時間等待dhcp分配ip超時。authoritative 指定當乙個客戶端試圖獲得乙個不是該dhcp伺服器分配的ip資訊,dhcp將傳送乙個拒...

springcloud Eureka引數作用

服務註冊中心配置 bean類 org.springframework.cloud.netflix.eureka.server.eurekaserverconfigbean eureka.server.enable self preservation false 關閉註冊中心的保護機制,eureka ...