在嵌套的Polymer自定义元素中访问JavaScript方法

Van*_*ita 3 javascript web-component polymer polymer-1.0

我正在尝试访问Polymer自定义元素中包含的Javascript方法<general-element>.此元素包含打开和关闭面板的功能.

这个通用元素在更具体的元素中使用,例如:<specific-element></specific-element>.特定元素包含常规元素并向其添加属性,即:面板标题等.

但是,在<specific-element>页面中使用时,我无法通过它调用任何打开/关闭方法.我是从错误的方式接近这个,有没有办法做到这一点?

编辑:代码示例

删除了一些Polymer代码 - 示例只是为了说明元素如何协同工作

一般元素:

<dom-module id="general-element">
    <template>
        // Code to define a slide-in panel
    </template>

    <script>
        _openPanel: function() {
            //Apply class to make panel visible
        },
        _closePanel: function() {
            // Apply class to hide panel
        }
    </script>
</dom-module>
Run Code Online (Sandbox Code Playgroud)

具体要素:

<dom-module id="specific-element">
    <template>
        <general-element title="Administration Panel" >
            <h1>Hello</h1>
        </general-element>
    </template>
</dom-module>
Run Code Online (Sandbox Code Playgroud)

用法:

<dom-module id="admin-page">
    <template>
        <button on-click="openPanel"></button>
        <specific-element></specific-element>
    </template>

    <script>
        openPanel: function() {
            // Trying to call general-element _openPanel method
        }
    </script>
</dom-module>
Run Code Online (Sandbox Code Playgroud)

我在这里尝试做的是调用openPanel行为,如general-element中所述.这是因为面板将在多个位置使用,因此保持为特定面板实现打开/关闭方法没有意义,因为它们将以相同的方式工作.

Gün*_*uer 5

这应该工作

openPanel: function() {
  // Trying to call general-element _openPanel method
  $$('specific-element').$$('general-element')._openPanel();   
}
Run Code Online (Sandbox Code Playgroud)