Javascript “切换图纸”对话框，该对话框位于自定义图元中

当涉及到使用聚合和JavaScript进行开发时，我是一个相当新的人，我有一种感觉，我切换我的论文对话框的方式不是最好的方式，或者可以改进。目前，我尝试从自定义元素外部调用toggle（）函数，尽管我遇到了一个错误，但它对我有效
我创建了一个名为my dialog的自定义元素：

<dom-module id="my-dialog">
  <template>
    <style>
      :host {
        display: inline-block;
      }
    </style>

    <paper-dialog id="popUp" with-backdrop on-iron-overlay-opened="patchOverlay">
      <!-- Dialog content -->
      <h2>Hello World</h2>
    </paper-dialog>

  </template>

  <script>
    Polymer({
      is: 'my-dialog',

    });
  </script>
</dom-module>

：主持人{
显示：内联块；
}
你好，世界
聚合物({
是‘我的对话’，
});

从我的一个页面上，我现在想在点击一个纸按钮时打开和关闭对话框。它工作得很好，但正如我上面提到的，我觉得这不是我在那里做的真正专业的事情

<dom-module id="my-profile-view">
  <template>
    <style>
      :host {
        display: block;
      }
    </style>

    <paper-fab icon="create" id="myBtn" on-tap="toggleDialog"></paper-fab>        
    <my-dialog id="myDialog"></my-dialog>

  </template>

  <script>
    Polymer({
      is: 'my-profile-view',

      //Open dialog
      toggleDialog: function() {
        var dialog = this.shadowRoot.querySelector('#myDialog');
        var popUp = dialog.shadowRoot.querySelector('paper-dialog');
        popUp.toggle();
      },
    });
  </script>
</dom-module>

：主持人{
显示：块；
}
聚合物({
是：‘我的个人资料视图’，
//打开对话框
toggleDialog:function（）{
var dialog=this.shadowRoot.querySelector（“#myDialog”）；
var popUp=dialog.shadowRoot.querySelector（'paper-dialog'）；
popUp.toggle（）；
},
});

错误消息。我进入控制台：

（程序）：5未捕获类型错误：无法读取null（匿名函数）@（程序）：5（匿名函数）@（程序）：20的属性“removeAttribute”

---

如果有人能帮我把事情弄清楚就好了。也许给我一个提示，我还能做些什么。

你的第二个元素

我的纵断面图

不应该知道你的第一个元素

我的对话框

的内部逻辑

相反，您的custome对话框应该公开一个公共方法（即

toggleDialog

）

my-dialog.html

：

第二个元素可以调用此方法

my-profile-view.html

：

---

你应该给你的第一个自定义元素

my dialog

添加一个方法，然后从这里调用

toggle（）

。但是这个方法在我的个人资料视图中被欺骗了。你能再定义一下你的答案吗？！错误消息。上面显然是一个与Chrome ADBlock的冲突，这正是我所寻找的。非常感谢你的解释。

Polymer({
  is: 'my-dialog',
  toggleDialog: function () {
    this.$.popUp.toggle()
  }
});

Polymer({
  is: 'my-profile-view',
  //Open dialog
  toggleDialog: function() {
    this.$.myDialog.toggleDialog()
  }
});