Javascript 未定义聚合纸对话框.open（）_Javascript_Polymer

Javascript 未定义聚合纸对话框.open（）

javascript polymer

Javascript 未定义聚合纸对话框.open（）,javascript,polymer,Javascript,Polymer,我想在单击按钮时打开一个纸张对话框。我尝试了以下两种方法：单击时=“dialog.open（）我收到以下错误：[my app:：\u createEventHandler]：侦听器方法dialog.open（）未定义我不明白为什么单击=“onCreateDialogTap”：我将onCreateDialogTap事件放在myapp.js中，并尝试通过 document.getElementById（'dialog'）我知道我不能通过这种方式访问它，因为它在本地dom中。但是，既然有多

我想在单击按钮时打开一个纸张对话框。我尝试了以下两种方法：

单击时=“dialog.open（）
我收到以下错误：[my app:：\u createEventHandler]：侦听器方法

dialog.open（）

未定义
我不明白为什么

单击=“onCreateDialogTap”：我将onCreateDialogTap事件放在myapp.js中，并尝试通过

document.getElementById（'dialog'）

我知道我不能通过这种方式访问它，因为它在本地dom中。但是，既然有多个本地dom层，我该如何访问它呢？我可以使用访问应用程序抽屉布局元素

Polymer.dom(document.querySelector('my-app').root).childNodes[0] //return app-drawer-layout element

但是如何访问对话框元素呢

这是我的index.html

<body>
 <my-app id="myApp"></my-app>
 <script src="scripts/myapp.js"></script>
</body>

你是否尝试过：this.$.dialog.open（）；？是的，它也不起作用。我也面临同样的问题@YU-WENHUANG你是如何解决这个问题的？@YU-WENHUANG我发现我犯了一个可怕的错误，我在link属性中使用了src属性而不是href

<dom-module id="my-app">
<template>
 <app-drawer-layout fullbleed>

  <app-header-layout has-scrolling-region>

    <app-header condenses reveals effects="waterfall">
      <app-toolbar>
        <paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
        <div main-title>My App</div>
      </app-toolbar>
    </app-header>

    <div class="content" style="height:100%;">
     <iron-pages attr-for-selected="data-route" selected="{{route}}" style="height:100%;">

        <section data-route="home" href="{{baseUrl}}" style="height:100%;">
         <paper-button id="button1" raised on-click="dialog.open()">open dialog button1</paper-button>
         <paper-button id="button2" raised on-click="onCreateDialogTap">open dialog button2</paper-button>
         <paper-dialog id="dialog">
           <h2>Dialog Title</h2>
           <p>Dialog Content</p>
         </paper-dialog>    
        </section>

        <section id="projects" data-route="projects" href="{{baseUrl}}projects" style="height:100%;">  
        </section>
     </iron-pages>
    </div>
  </app-header-layout>
 </app-drawer-layout>
</template>

  var app = document.querySelector('my-app');

  app.onCreateDialogTap = function(e){
   var createDialog = document.getElementById('dialog'); //return null
   dialog.open();
  }