Question

尝试使用元素显示问候世界，但没有任何帮助吗？

的index.html

＆＃13;

<!DOCTYPE html>
<html>
	<head>
	<meta name="viewport"
    content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">

  <script src="bower_components/webcomponentsjs/webcomponents.js"></script>
		<link rel="import" href="elements/hello-world.html">
	</head>	
<body unresolved>
<hello-world></hello-world>
</body>
</html>

＆＃13;

您好-world.html

＆＃13;

<link rel="import" href="../bower_components/polymer/polymer.html">

<polymer-element name="hello-world" nonscript>
	<template>
			<h2>Hello World</h2>
	</template>
</polymer-element>

＆＃13;

Answer 1

＆＃34; hello-world.html＆＃34;的代码现在是：

  <link rel="import" href="../bower_components/polymer/polymer.html">
 <dom-module id="hello-world">
 <template>
 <h1>Hello World</h1> 
</template>
 <script>
 Polymer ({ is: "hello-world", }); 
</script>
 </dom-module>

Answer 2

如果您使用聚合物版本0.8或0.9，则<polymer-element ...应为<dom-module ...

从聚合物网站了解更多信息：

https://www.polymer-project.org/0.9/docs/start/quick-tour.html

Answer 3

你有一个错字，nonscript需要是noscript。

<polymer-element name="hello-world" noscript>

Answer 4

我遇到同样的问题而且没有发现错误。

的index.html

<html>
    <head>
        <title>Polymer-Application</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!--<script src="bower_components/jquery/dist/jquery.min.js"></script>-->
        <script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
        <!-- file is available, auto completed by api -->

        <link rel="import" href="hello/hello.html">
        <!-- file is available, auto completed by api -->
        <!-- netbeans doesn't know relation import -->
    </head>
    <body>
        <h1>My first Polymer-Application</h1>
        <hello></hello>
    </body>
</html>

您好/ hello.html的

<link rel="import" href="../bower_components/polymer/polymer.html">
<!-- file is available, auto complete by api -->
<polymer-element name="hello" noscript>
    <template>
        <h1>Hello Polymer world</h1>
    </template>
</polymer-element>

我的平台是：

Win 8.1
的NodeJS
亭子
聚合物（安装在凉亭上，文件夹和文件可用）
GIT中
netbeans dev edition（作为编辑）
xammp（作为apache webserver）

使用chrome，firefox和ie10进行测试，并且不显示自定义元素。我不认为这是一个浏览器问题。它是你可以写的最简单的元素，但为什么它不起作用？

编辑：

在干净的ubuntu安装上测试它。它仍然无法正常工作？我还测试了聚合物页面的原始代码，这也不行。我是傻瓜复制贴吗？

编辑2：

我发现它已经运行了我的聚合物应用程序。如果我使用Polymer 1.0.9，我不应该阅读0.5.0的教程

的变化：

的index.html：

<!DOCTYPE html>
<html>
  <head>
    ...
    <script scr="bower_components/webcomponents-lite.min.js"></script>
    <!-- the lite edition is needet since polymer version 0.8 -->
    <link rel="import" href="hello/hello.html">
    ...
  </head>
  <body>
    <hello></hello>
  </body>
</html>

您好/ hello.html的：

<link rel="import" href="../bower_components/polymer/polymer.html">
<dom-module id="hello">
  <!-- its not longer a polymer-element. we have to use dom-module and id and the noscript option is not longer supported -->
  <template>
  <template>
  <script>
    // everytime you need to initialize a Polymer object
    Polymer({
      is: 'hello' // must be set now
    });
  </script>
</dom-module>

如果你想使用参数，你需要在聚合物就绪函数中设置它，并且每个占位符必须被一个html标签包围，例如span，而不包含任何其他内容。

Answer 5

替换

行

<script src="bower_components/webcomponentsjs/webcomponents.js"></script>

与

<script src="../bower_components/webcomponentsjs/webcomponents.js"></script>

这应解决问题。

聚合物不工作或不显示元素

5 个答案: