聚合物元素未在字符串/文本中的聚合物中注册

Polymer Element not registered in polymer from string/text

本文关键字：聚合物 注册 文本 字符串 元素      更新时间：2023-09-26

有人能帮我说明我在这个例子中做错了什么吗http://jsbin.com/bekoxo/2/edit?html，输出#H:L23

chrome检查器的屏幕截图位于-https://www.dropbox.com/s/t6uua7h714h2otg/Screenshot%202014-10-13%2001.32.54.png？dl=0

我可以发现元素（应用程序页面）没有成功注册，模板显示的是文档片段，而不是所需的影子根

第二个元素，其中聚合物定义是标记（相同标记）的一部分，被成功呈现。

有人能指出我遗漏了什么吗？以便使示例的第一部分也起作用。

（通过javascript创建元素并立即使用）

编辑——下方的问题代码

<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.3.3/platform.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.3.3/polymer.js"></script>
<meta name="description" content="problem with dynamically building a polymer element" />
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
  <script>  
var scr = '<polymer-element name="appler-page"><template>template content {{test}}</template><script>var proxymodel = {};proxymodel["test"] = "testfie" ;'+
    'Polymer(proxymodel);<'/script><'/polymer-element><appler-page><'/appler-page>';
  $(document).ready(function(){
  document.getElementById("fie").onclick = function(){
   var divel = document.createElement("div");
    divel.innerHTML = scr;
    document.querySelector(".polymerized").innerHTML = "";
    document.querySelector(".polymerized").appendChild(divel);
}
  });
  </script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <input type="button" id="fie" value="fie"/>
  <div class="polymerized">before content</div>

EDIT——针对问题的一个更好的jsbin

http://jsbin.com/bekoxo/2/edit?html，输出#H:L23

这里有一种方法可以强制注册元素（我相信这就是第一个元素要做的）。我把你的例子简化了一点。

<!DOCTYPE html>
<html>
  <head>
    <meta charset=utf-8 />
  </head>
  <body>
    <script src="http://www.polymer-project.org/platform.js"></script>
    <link rel="import"
          href="http://www.polymer-project.org/components/polymer/polymer.html">
    <script>
      Polymer('appler-page', {test: 'testfile'});
      var el = document.createElement('div');
      el.innerHTML = ''
<polymer-element name="appler-page">'
  <template>template content {{test}}</template>'
</polymer-element>';
      document.body.appendChild(el);
    </script>
    <appler-page></appler-page>
  </body>
</html>

请参阅http://jsbin.com/qifupa/edit

我发现的另一个使用最新Polymer版本的例子。

这是一段工作代码，如果其他人正在尝试同样的事情，它可能会对他们有所帮助。

我切换到Polymer-project.org地址进行进口，结果成功了。

http://jsbin.com/bekoxo/14/edit?html，输出#H:L23

相关文章：