聚合物纸 - 对话框不可见

Question

在我的页面上，我想要一个Polymer Paper-Dialog，所以我写了一个自己的元素，如下所示：          

<polymer-element name="my-dialog" constructor="MyDialog" extends="paper-dialog" noscript>
    <template>
        <span>I'm a dialog!</span>
    </template>
</polymer-element>

现在我尝试使用这个JS代码显示对话框：

var dialog = new MyDialog();
dialog.toggle();

但是对话框没有显示出来。有什么想法吗？

Answer 1

当您在javascript函数中创建新的Dialog时，您无法在任何地方将其添加到DOM。因此，当您在其上调用切换时，它会尝试显示/隐藏尚未添加到页面的对话框。

如果你想让它工作，你应该将对话框的标记添加到你的html中，在javascript中获取对该元素的引用，然后调用切换。

您可以考虑做的其他事情是查看Core-Overlay聚合物元素。它为您处理许多对话功能，甚至允许您遮蔽对话框本身不包含的所有内容。