Question

将聚合物导轨宝石与Rails 4.2配合使用，我可以使用预定义的聚合物元素，如纸质元素组和铁元素组。

然而，当我制作自己的元素时，它们不会被渲染。

E.g。我用这个命令创建了一个元素

rails g polymer:component testing

我没有动摇

/app/assets/components/testing/testing.html看起来像这样：

<dom-module id="testing">
  <link rel="stylesheet" href="testing.css" />
  <template>

    <h2>Testing</h2>
  </template>

  <script src="testing.js"></script>
</dom-module>

/app/assets/components/testing/testing.js看起来像这样：

Polymer({
  is: "testing"
});

/app/assets/components/application.html.erb有这个：

//= require polymer/polymer
//= require paper-styles/paper-styles
//= require iron-icons/iron-icons
//= require paper-tooltip/paper-tooltip
//= require easy-paper-tabs/easy-paper-tabs
//= require testing/testing

<head>的{{1}}就是：

/app/views/layouts/application.html.erb

当我将标记<head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/> <title><%= full_title(yield(:title)) %></title> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> <%= javascript_include_tag "https://www.google.com/jsapi", "chartkick" %> <%= csrf_meta_tags %> <%= favicon_link_tag %> <%= html_import_tag 'application', 'data-turbolinks-track' => true %> </head>放入视图时，我希望看到h2标题为“Testing”，但我没有。相反，那里没有任何东西。当我检查页面时，我只看到空标记<testing></testing>。

我错过了什么？

我已尝试将<testing></testing>标记放入不同的视图

我已尝试将<testing></testing>替换为<%= html_import_tag 'application', 'data-turbolinks-track' => true %>

中的<%= html_import_tag 'application' %>

我已尝试将自定义组件放入/app/views/layouts/application.html.erb而不是/vendor/assets/components/testing/

对于我试过的每一件事，我重新启动了服务器。

Answer 1

我注意到控制台记录了一个错误，说

Failed to execute 'registerElement' on 'Document': Registration failed for type 'testing'. The type name is invalid.

所以我搜索了它，发现网络组件规范奇怪地要求所有用户创建的元素在其名称中使用连字符！没有太多关于此的文档 - 它就像秘密知识。

在元素名称中加一个连字符可以解决我的问题。

我的自定义元素在带有聚合物导轨的Rails 4.2中不起作用

1 个答案: