是否可以动态实例化自定义聚合物元素传递 JSON 数据答案

【问题标题】：Is it possible to dynamically instantiate custom polymer element passing JSON data是否可以动态实例化自定义聚合物元素传递 JSON 数据
【发布时间】：2015-10-29 13:32:42
【问题描述】：

是否可以将复杂数据（如 JSON 数组）传递给动态实例化的自定义元素？

我想实例化一个元素，传递给他一个大的 JSON 数组。对于 JSON 数组的每一行，此元素将启动子元素，将 JSON 行传递给它们。我想知道如何将 JSON 数据传递给动态实例化元素

喜欢：

<my-list> 元素将通过首先检索 JSON 数据来填充自身，然后使用新获取的数据动态创建子元素
对于每一行，它将以编程方式（来自 dart 文件）创建一个 <my-list-item myData="">，将给定的 JSON 数组行作为 myData 传递给 <my-list-item> 元素

有可能吗？如果是，创建子元素时如何传递数据？

我当前的 my-list.dart 等价物：

@PolymerRegister('my-list')
class my-list extends PolymerElement {
  @property int listSize;        // number of blink tickets per panel

  MyList.created() : super.created() {
    //retrietve
    JSON data = //will find later how to use JSON
    //Init
    initializeList(data);
  }

  void initializeList(JSON data) {
    for row in data {
      BlinkTicket ticket = new BlinkTicket(row);
    }

  }
}

我的 list-item.dart：

@PolymerRegister('my-list-item')
class MyListItem extends PolymerElement {

  @property JSON data;

  factory MyListItem() => new Element.tag('my-list-item');

  MyListItem.created() : super.created() {
    //init self with data
  }
}

【问题讨论】：

标签： json dart polymer dart-polymer

【解决方案1】：

<dom-module id="my-list-item>
...
</dom-module>

@PolymerRegister('my-list-item')
class MyListItem extends PolymerElement {
  factory MyListItem() => new Element.tag('my-list-item');
  MyListItem.created() : super.created();

  @property Map data;
}

然后从未来的父元素中实例化它

List json = JSON.decode(getSomeJson());
for(var item in json) {
  var some = new SomeElement();
  Polymer.dom(root).append(some);
  // or to add it to the light DOM instead of the shady/shadow DOM
  // Polymer.dom(this).append(some);
  some.set('data', item);
}

（未测试）

【讨论】：