Dart聚合物模板中的数字循环 [英] Numeric for loop in Dart Polymer templates

问题描述

如何在聚合物自定义元素模板中写入数字 for 循环？我的意思是像

How do I write a numeric for loop in a polymer custom element template? I mean something like

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

在当前版本的Dart 1.0中是否可能？

Is it possible in the current version of Dart 1.0?

推荐答案

目前没有，这是不可能的Polymer.dart（或Polymer.js到我的知识）。重复绑定需要可迭代（请参阅 Polymer_expressions 库的重复模板部分）。很遗憾，由于问题12669 ，也无法使用列表文字来完成此操作。

Currently no, this is not possible in Polymer.dart (or Polymer.js to my knowledge). The repeat binding requires an iterable (See Repeating Templates section of the Polymer_expressions library). Unfortunately due to Issue 12669 it is also not possible to use a list literal to accomplish this either.

使用过滤器，我们可以完成这个：

Using a filter we can accomplish this:

<!-- 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> 将输出：

Creating a page which imports myelement.html and using <my-element></my-element> will output:

<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>

这篇关于Dart聚合物模板中的数字循环的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！