dart - 使用 Polymer-Dart 和 Dart 对象进行数据绑定(bind)

Question

我有一个名为 MyClass 的自定义类.我有一个 List<MyClass> testList在我的自定义元素中，并希望使用数据绑定(bind)来显示列表的内容。

我的类(class):

class MyClass {

  String name;

  MyClass(String name) {
    this.name = name;
  }

}

custom_element.dart:

  ...

  attached() {
    super.attached();
    var lst = new List<MyClass>();
    lst.add(new MyClass('test'));
    set('testList', lst);
  }

  ...

custom_element.html:

  ...

  <template is="dom-repeat" items="{{testList}}">
      <span>{{item}}</span>
      <span>{{item.name}}</span>
  </template>

  ...

但是，输出是:

  <span>[object DartObject]<span>
  <span><span>
  <span>[object DartObject]<span>
  <span><span>

为什么不显示对象的名称？如何访问属性名称？都不是 item.name也不item['name']工作...它曾经在 Polymer 0.5 和相应的 Polymer-Dart 版本上工作。 :(

Answer 1

这有点令人困惑，因为还没有新的 polymer 版本的文档，但您(应该)需要做的就是让您的类扩展 JsProxy 类。如果您在 behaviors 分支上，您还需要使用 @jsProxyReflectable 注释该类。例如:

// @jsProxyReflectable // only if you are on the `behaviors` branch
class MyClass extends JsProxy {
  @reflectable // from >= 1.0.0-rc.2
  String name;

  MyClass(String name) {
    this.name = name;
  }
}