2013-10-17 52 views
11

我想遍歷一個枚舉,並顯示一個計數器獲取鏢聚合物重複模板指數

<div template repeat="{{ name in names }}"> 
    ###. {{name}} 
</div> 

我應該怎麼放,而不是###因此它顯示名稱的位置:

1. John Doe 
2. Jane Doe 
3. etc... 

回答

17

聚合物現在有能力做到這一點:取自

<template repeat="{{fruit in fruits | enumerate}}"> 
    <li>You should try the {{fruit.value}}. It is number {{fruit.index}}.</li> 
</template> 

https://github.com/sethladd/dart-polymer-dart-examples/blob/master/web/iterate_loop_index/my_example.html

+0

這不再適用於聚合物0.5。改爲使用Wolfram的解決方案。 我知道這是2年前的答案,但讓我注意到從搜索到達的人。 –

+0

這仍然是聚合物0.5的方式。也許你的意思是1.0? – pjv

2

它在web_ui中可用,但尚未在Polymer中提供。

Web UI是polymer.dart的前身。 Polymer.dart幾乎與Web UI的功能相同。下面是尚未在polymer.dart實現了Web UI功能列表:

指數變量的值可循環

https://www.dartlang.org/polymer-dart/#web-ui-parity

在此之前的裏面,你可以使用列表上的asMap並遍歷keys

<template repeat="{{i in names.asMap().keys)}}"> 
    <div>{{i}}: {{names[i]}}</div> 
    </template> 
+1

你甚至不必重寫該名稱:在遍歷集合德興。 {{index in names.asMap.keys}} –

+0

@AlanKnight非常酷,謝謝你的提示。我更新了我的答案以使用您的建議。 – Nathanial

7

其他解決方案不適用於聚合物0.3.4(不再?),但有documentation on templates,包括在內

<template repeat="{{ foo, i in foos }}"> 
    <template repeat="{{ value, j in foo }}"> 
    {{ i }}:{{ j }}. {{ value }} 
    </template> 
</template>