遇到聚合物重复问题

Question

我对Polymer(和Dart)很新,我怀疑我在这里遗漏了一些明显的东西.在我的应用程序中,我有代码迭代对象列表,并在UL中将项目呈现为LI元素.列表未正确呈现.

在简化了我的内容之后,这里是我的自定义元素的Dart代码:

import 'package:polymer/polymer.dart';

@CustomTag('users-element')
class UsersElement extends PolymerElement {
  @observable List users = toObservable(['Mike', 'Anne', 'Kim']);
  UsersElement.created() : super.created() {}
}

这是相关的HTML代码:

<polymer-element name="users-element">
  <template>
    <ul>
      <li repeat="{{user in users}}">
        {{user}}
      </li>
    </ul>
  </template>
  <script type="application/dart" src="users_element.dart"></script>
</polymer-element>

Answer 1

你的Dart代码看起来很好.问题是你使用的方式repeat.你不能直接附加repeat到<li>.相反,你需要来包装<li>的一个<template>标签,并附加repeat了这一点.这应该工作:

<polymer-element name="users-element">
  <template>
    <ul>
      <template repeat="{{user in users}}">
        <li>
          {{user}}
        </li>
      </template>
    </ul>
  </template>
  <script type="application/dart" src="users_element.dart"></script>
</polymer-element>