如何显示 Polymer 对话框

Question

我正在尝试通过显示一个简单的消息对话框开始使用 Google 的 Polymer Paper Elements 1.0：

<html>
<head>
   <script src="scripts/polymer/webcomponentsjs/webcomponents.min.js"></script>
</head>
<body>

<paper-dialog opened="true">Dialog test</paper-dialog>

</body>
</html>

"Dialog test" 字样出现在页面上，但没有对话框。有谁知道我错过了什么？

Answer 1

您缺少对 paper-dialog 元素定义的引用。

<html>
    <head>
        <title>Example</title>
        <script src="path/to/webcomponentsjs/webcomponents-lite.js"></script>
        <link rel="import" href="path/to/paper-dialog/paper-dialog.html" />
    </head>
    <body>
        <paper-dialog opened="true">Dialog test</paper-dialog>
    </body>
</html>

包括正确的导入 (<link rel="import" href="path/to/paper-dialog/paper-dialog.html" />) 将允许元素被浏览器识别并提供您期望的功能，包括行为和样式。

有关使用 Web 组件的交互式教程，您可以查看 tutorial on component.kitchen。

如何显示 Polymer 对话框

How to display Polymer dialog

javascript

polymer-1.0