高分子Javascript。 轻击事件时无法将数据传递给其他聚合物元素，而无需调用聚合物元素

Question

我有两个聚合物元素： <element-a> <element-b>它们都是父<element-c>内的子元素，并且每个<element-c>都位于不同的文件中。

在<element-a> ，我有一个<paper-listbox> ，里面有一些<paper-item> ，它带有on-tap事件以获取其值。

目标是：在<element-b>端，我想从具有以下内容的url的API获取：

api / configs / {{tempId}}

并在触发<element-a>触发事件中的<paper-listbox>时，将其称为<element-b>的<p> 。 {{tempId}}是从<element-a>一侧选择的<paper-listbox>的值。

我已经获得了选择的<paper-listbox>值，我尝试将其打印在控制台上，但是不知道如何在不调用该元素的情况下将其传递给<element-b> 。 已经以某种方式尝试过，例如使用会话存储为{{tempId}}设置一个临时值，但是在<element-b>端调用它时不知道。 我从'ready：function'尝试调用它，没有用。 我只是试着确定一下。

以下是一些说明代码

// element-a.html
    ...
    <paper-listbox selected="0">
        <template is="dom-repeat" items="{{response.data}}">
          <paper-item value="{{item.id}}" on-tap="_getId">
            Configuration ID {{item.id}}
          </paper-item>
        </template>
      </paper-listbox>

<script>
...
_getId: function(e) {
  var tempId = e.path[0].value;
  console.log(e.path[0].value);
}
...
</script>

然后

//element-b.html
<iron-ajax
  ...
  url="api/configs/{{tempId}}"
  ...
  >

非常感谢您的帮助。 谢谢。

Answer 1

如果该属性位于父元素中，则可以在子元素中使用该属性，如下所示

<element-b temp-id=[[tempId]]></element-b>

但是在您的情况下，您可以在父元素中包含一个侦听器

listeners: {
 'on-tap-listener': '_abc'
}

然后像这样在<element-a>触发事件

_getId: function(e) {
  var tempId = e.path[0].value;
  console.log(e.path[0].value);
  this.fire('on-tap-listener',tempId);
}

现在，您将tempId放在父元素中，并将其分配给属性，然后将其绑定到element-b如上所示

_abc:function(data){
   this.tempId = data.detail.tempId;
},