聚合物节点到元素属性

Question

我有下一个聚合物元素：

<link rel="import" href="../../lib/polymer/polymer.html">
<polymer-element name="ss-timeline" attributes="musicChooser photoSelector">
    <template>
        <div></div>
    </template>
    <script type="text/javascript">
        (function() {
            "use strict";
            Polymer('ss-timeline', {
                created: function(){
                    this.musicChooser = this.musicChooser || {};
                    this.photoSelector = this.photoSelector || {};
                },
                ready: function () {
                    console.log(this.musicChooser, this.photoSelector);
                },
                musicChooserChanged: function(oldVal, newVal) {
                    console.log('musicChooserChanged', oldVal, newVal);
                }
            });
        })();
    </script>
</polymer-element>

所以我必须像这样传递到musicChooser和photoSelectorNode对象中：

<ss-music-chooser id="musicChooser"></ss-music-chooser>
<ss-timeline musicChooser="{{$.musicChooser}}"></ss-timeline>

但是在控制台输出中，我得到：

Object {} Object {}

如何通过属性传递节点对象？请帮忙。

附言我看到核心下拉列表具有相同的相关目标属性：

<core-icon-button id="trigger" icon="menu"></core-icon-button>
<core-dropdown relatedTarget="{{$.trigger}}">
  <core-menu>
    <core-item>Cut</core-item>
    <core-item>Copy</core-item>
    <core-item>Paste</core-item>
  </core-menu>
</core-dropdown>

所以这在理论上应该有效...

附言顺便说一下，如果我传入属性musicChooser="123"，我会在我的元素中得到它。但是由于某种原因忽略了节点对象。

Answer 1

更改后的观察程序应该可以工作，下面是一个示例。

我想知道问题是否与您使用自动节点查找有关。该$只能在另一个 Polymer 元素内部工作（也可能在自动绑定模板内部，但我需要仔细检查）。