Question

我正在尝试迭代列表以创建一个选择下拉框。我的代码在下面显示为Web组件

<!DOCTYPE html>
<polymer-element name="epimss-name">
  <template>
    <label for='titleCmbo' id='titleLbl'>Title</label>

    <template repeat="{{title in titleList}}">
      <select id='titleCmbo'>
        <option value='{{title}}'>{{title}}</option>
      </select> 
    </template>

  </template>
  <script type="application/dart">

    import 'package:polymer/polymer.dart';

    @CustomTag( 'epimss-name' )
    class NameElement extends PolymerElement
    {
      final List<String> titleList = toObservable([ '', 'Dr', 'Miss', 'Mr', 'Mrs', 'Prof'  ]);
    }

  </script> </polymer-element>
</body>
</html>

代码是，它为每次迭代创建一个单独的组合。如果我将标签移到嵌套模板之外，编辑器会抱怨。

这样做的正确方法是什么？

由于

Answer 1

您可以在选项标签上使用模板属性。它将为模板集合中的每个项重复选项元素和循环值。

<select id="titleCmbo">
  <option value="{{title}}" template repeat="{{title in titleList}}">
    {{title}}
  </option>
</select>

如何使用polymer-dart repeat </select>创建<select>元素

1 个答案: