聚合物将数据绑定到 div

Question

我有一个聚合物元素，我可以在其中声明一个数组并按如下方式使用它。

  ...
  <template repeat="{{chapters as chapter}}">
    <core-submenu id='{{chapter.id}}-core-submenu' label="{{chapter.label}}">
    </core-submenu>
  </template>
  ...
  Polymer('app-element', {
    chapters: [{id: one, label: one}, {id: two, label: two}],
    ...
    somethingChanged : function(){
      this.$[this.chapter.id + '-core-submenu']
    }
    ...
}

如果我像上面那样填充章节对象，它会按预期工作。

我想从外面写这些章节。然后我执行以下操作：

  var app = document.querySelector('#app');
  window.addEventListener('polymer-ready', function() {
    app.chapters = [{id: one, label: one}, {id: two, label: two}];
  });

如果我这样做，this.$[this.chapter.id + '-core-submenu'] 现在为空。我猜这是因为 this.$ 在聚合物就绪事件被触发之前被填充了。

这有意义吗？现在访问此元素的最佳做法是什么？我希望仍然能够通过 this.$ 访问它。

最好的 尼古拉斯

Answer 1

我建议将此属性公开为聚合物属性，然后使用 setAttribute 从外部访问该属性

window.addEventListener('polymer-ready', function() {
    var app = document.querySelector('#app');
    app.setAttribute('chapters',[{id: one, label: one}, {id: two, label: two}]);
});