将父聚合物元素数据暴露给子元素

Expose parent Polymer element data to a child element

本文关键字：元素 暴露 数据 聚合物      更新时间：2023-09-26

我有以下结构：

<main-container data-endpoint="/api/allrecent">
  <section>
  <list-container data-source="{{feed.recent}}" data-type="member" data-title="Recent Members"></list-container>
  </section>
</main-container>

在main-container.js中，我用类似于的Promise获取数据

var self = this;
connector.get(this.dataset.endpoint)
.then(function(data) {
  self.feed = JSON.parse(data);
});

现在，我想将self.feed公开给list-container作为数据源。这意味着当Promise被解析时，它将填充列表容器的内容。

我只是在访问list-container内部的提要时遇到了麻烦。我已经阅读了一些SO答案和Polymer文档，但还没有找到实现这一点的正确方法。

解决方案可能很简单（就像一个要绑定的属性），但还没有找到。

如果您想使用绑定，您需要一个Polymer元素或一个<auto-binding>标签，该标签具有包裹<main-container>元素的模型。

<polymer-element name="some-element" attributes="feed">
  <template>
    <main-container data-endpoint="/api/allrecent" feed="{{feed}}">
      <section>
      <list-container data-source="{{feed.recent}}" data-type="member" data-title="Recent Members"></list-container>
      </section>
    </main-container>
  </template>
</polymer-element>

现在可以将<main-container>和<list-container>中的一个属性绑定到<some-element>中的同一个属性。

相关文章：