Question

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

上单击=“dialog.open（）
我收到此错误： [my-app :: _ createEventHandler]：未定义的侦听器方法dialog.open()
我不明白为什么
on-click =“onCreateDialogTap”：我在myapp.js中放入了onCreateDialogTap事件并尝试通过
访问对话框元素
的document.getElementById（ '对话框'）;

我知道我无法通过这种方式访问它，因为它位于本地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>

MY-app.html

<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>

myapp.js

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

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

聚合物paper-dialog.open（）未定义

0 个答案: