Polymer 聚合物加工中获取自定义元素的问题_Polymer_Web Component

Polymer 聚合物加工中获取自定义元素的问题

polymer

Polymer 聚合物加工中获取自定义元素的问题,polymer,web-component,Polymer,Web Component,我遵循了聚合物官方网站上的入门教程：我正在尝试测试网络组件和聚合物，但我无法让一个基本的模板工作。我无法在屏幕上渲染任何内容。你知道我错过了什么吗我保证5000%的文件链接正确。我在日志中没有看到任何错误。我使用的是github repo的Polymer 0.8预览版。我使用的是最新版本的Chrome（38.0.2125.122）。我使用的是MAMP，所以HTML导入可以工作。为了以防万一，我甚至加入了polyfill的web组件。我在任何地方都找不到一篇文章表明我做错了什么。

我遵循了聚合物官方网站上的入门教程：

我正在尝试测试网络组件和聚合物，但我无法让一个基本的模板工作。我无法在屏幕上渲染任何内容。你知道我错过了什么吗

我保证5000%的文件链接正确。我在日志中没有看到任何错误。我使用的是github repo的Polymer 0.8预览版。我使用的是最新版本的Chrome（38.0.2125.122）。我使用的是MAMP，所以HTML导入可以工作。为了以防万一，我甚至加入了polyfill的web组件。我在任何地方都找不到一篇文章表明我做错了什么。这一切似乎都很简单

自定义元素：

<link rel="import" href="polymer/polymer.html">

<polymer-element name="app-list" noscript>
  <template>
    <ul>
      <li>Hello World!</li>
      <li>Hello World!</li>
      <li>Hello World!</li>
    </ul>
    <content></content>
  </template>
</polymer-element>



你好，世界
你好，世界
你好，世界

索引：

<!DOCTYPE html>
<html lang="en-us">

  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width" initial-scale="1">
    <script src="webcomponentsjs/webcomponents.js"></script>
    <link rel="import" href="app-list.html">
  </head>

  <body>
    <div class="page">
      <app-list></app-list>

      <!-- etc... -->

我无法从主分支或0.8预览分支使GitHub版本正常工作。我从bower安装了它，它运行良好。

在基于Chromium-38的节点webkit测试设置中，您的代码对我来说运行良好。但是，如果我尝试在Chrome中运行相同的代码（使用本地文件作为应用程序列表），那么HTML导入将失败，原因是CORS异常，屏幕上没有显示任何内容。我建议您打开Chrome开发工具，验证app list元素是否已注册，并在其阴影DOM中包含您的模板：

  <body>
    <div class="page">
      <app-list>
        #shadow-root
          <ul>
            <li>Hello World!</li>
            <li>Hello World!</li>
            <li>Hello World!</li>
          </ul>
          <content></content>
      </app-list>


#影子根

你好，世界
你好，世界
你好，世界

（这是您应该在开发工具的“元素”选项卡中看到的内容的重新创建）

祝你好运。

0.8预览版对创建新元素的语法进行了一些更改。它还在烘烤，还没有真正准备好供公众食用。当您从bower安装时，您得到了0.5.1，这是当前版本，也是您现在应该使用的版本。