Dart聚合物模板中的循環數字

Question

如何在聚合物定製元素模板中爲循環編寫數字？我的意思是這樣

<template repeat="{{for i = 1 to 10}}"> 
<div>item</td> 
</template> 

是否有可能在DART 1.0的最新版本？

Answer 1

目前沒有，這是不可能在Polymer.dart（或據我所知Polymer.js）。重複綁定需要可迭代（請參見Polymer_expressions庫的重複模板部分）。不幸的是，由於Issue 12669也不可能使用列表文字來實現這一點。

使用過濾器，我們可以做到這一點：

<!-- myelement.html --> 

<polymer-element name="my-element"> 
    <template> 
    <div> 
     <template repeat="{{ 5 | myFilter }}"> 
     <p>Write me {{ }}</p> 
     </template> 
    </div> 
    </template> 
    <script type="application/dart" src="myelement.dart"></script> 
</polymer-element> 

// myelement.dart 

import 'package:polymer/polymer.dart'; 
import 'package:polymer_expressions/filter.dart'; 

@CustomTag('my-element') 
class MyElement extends PolymerElement { 
    final Transformer myFilter = new GenerateIterable(); 

    MyElement.created() : super.created(); 

} 

class GenerateIterable extends Transformer<Iterable, int> { 
    int reverse(Iterable i) => i.length; 
    Iterable forward(int i) => new Iterable.generate(i, (j) => j + 1); 
} 

創建其中進口myelement.html一個頁面，並使用<my-element></my-element>將輸出：

<div> 
    <p>Write me 1</p> 
    <p>Write me 2</p> 
    <p>Write me 3</p> 
    <p>Write me 4</p> 
    <p>Write me 5</p> 
</div>