DART Web UI：如何在迭代循环中引用索引答案

【问题标题】：DART Web UI: How to reference index in iterate loopDART Web UI：如何在迭代循环中引用索引
【发布时间】：2013-01-03 02:33:23
【问题描述】：

我想用 HTML 中迭代循环的索引作为值，如：

   <select bind-value="gAddItem.drawType" 
            template iterate="int ind = 0; ind < gDrawDescs.length; ind++">
     <option value="{{ind.toString()}}"> {{gDrawDescs[ind]}} </option>
     </select>

但这种直观的语法似乎不起作用。有没有办法在 Dart Web-ui 中做到这一点？

【问题讨论】：

标签： dart dart-webui

【解决方案1】：

大家好！几个月前，Seth Ladd 与 Peter B 的回答相关的问题是 fixed，所以现在您可以从 <template> 内部引用 {{$index}}。从该提交中添加的测试代码：

Test the $index meta variable:
<template repeat="item in items" indentation="remove">
  <div>
    "{{item}}" is the {{$index}}{{suffix($index)}} item out of {{$list.length}}.
  </div>
</template>

【讨论】：

【解决方案2】：

Dart 似乎不允许使用列表范围文字，这将允许简洁的解决方案：

iterate="ind in [0 ... gDrawDescs.length]"

要解决这个问题，请创建以下函数：

List<int> createList(final int cnt) {
  var list = new List();
  for (var i=0; i<cnt; i++) {
     list.add(i);
  }
  return list;
}

在 HTML 中：

iterate="ind in createList(gDrawDescs.length)"

【讨论】：

这几乎是最好的。 Dart 的 Web UI 库不公开当前索引迭代变量，因此您需要创建自己的范围类型函数来执行此操作。看到这个错误：github.com/dart-lang/web-ui/issues/277 如果你同意这是 Web UI 应该做的事情，你可以发表评论。

【解决方案3】：

或者考虑一下

Iterable<int> Indices(int size) => Iterable<int>.generate(size, (i) => i);

【讨论】：