在 Polymer Dart 中扩展纸张项目
Posted
技术标签:
【中文标题】在 Polymer Dart 中扩展纸张项目【英文标题】:Extending paper-item in Polymer Dart 【发布时间】:2014-09-29 01:39:10 【问题描述】:我一直在尝试从 paper_elements 包中扩展 paper-item 元素。我在扩展我自己的元素时做的事情,但是失败了。
<link rel="import" href="../../packages/polymer/polymer.html">
<link rel="import" href="../../packages/paper_elements/paper_item.html">
<polymer-element name="x-item" extends="paper-item">
...
</polymer-element>
@CustomTag('x-item')
class XItem extends PaperItem
XItem.created() : super.created();
我没有收到错误消息,也没有初始化任何 Polymer 元素,页面的空白部分是我放置 Polymer 元素的地方。
我尝试使用与扩展按钮或 div 等内置 HTML 元素相同的方法。那也失败了。
<link rel="import" href="../../packages/polymer/polymer.html">
<link rel="import" href="../../packages/paper_elements/paper_item.html">
<polymer-element name="x-item" extends="paper-item">
...
</polymer-element>
@CustomTag('x-item')
class XItem extends PaperItem with Polymer, Observable
XItem.created() : super.created()
super.polymerCreated();
我得到了
Breaking on exception: NotSupportedError: Registration failed for type 'x-item'. The tag name specified in 'extends' is a custom element name. Use inheritance instead.
如果我删除聚合物模板定义的扩展部分,我又什么也得不到。页面中放置了 Polymer 元素的地方,除了空白什么都没有。
如果我通过导入实际的 JS 版本 polymer-item.html 仍然会发生之前的错误
<link rel="import" href="../../packages/paper_elements/src/paper-item/paper-item.html">
虽然我仍然需要使用 super.polymerCreated(); 扩展 PaperItem 与 Polymer 和 Observable;生成该错误。
我知道 Polymer Dart 团队做了一些诡计来让底层的纸元素(用 JS 编写)几乎像 Polymer Dart 元素一样工作。我想这就是造成问题的原因。我的问题是如何克服这个问题,以便我可以在 Dart 中扩展一个纸元素?
更新 - 已提交错误 https://code.google.com/p/dart/issues/detail?id=20388
【问题讨论】:
您在第二个示例中添加的内容仅在扩展 DOM 元素时才需要。 我知道,但我很绝望,并认为它可能会奏效。它还阻止其他人建议它 我试过了也对我不起作用。 【参考方案1】:我试过了,它也对我不起作用。 我很确定这是纸元素/核心元素中使用的 Polymer.js 元素的 Dart 包装器的错误/缺失功能。
您尚未添加元素的 HTML。
您的扩展元素模板是否包含 <shadow></shadow>
元素?
<polymer-element name="x-item" extends="paper-item">
<template>
<shadow></shadow>
</template>
</polymer-element>
【讨论】:
我也确定这也是一个错误。他们可能还没有达到那部分。 同时我将使用聚合。我相信 4 人帮还是建议过度继承 :-) 您打算提交错误/功能请求吗? 是的,我会尽快以上是关于在 Polymer Dart 中扩展纸张项目的主要内容,如果未能解决你的问题,请参考以下文章
Angular Dart 和 Polymer Dart 的区别
App Engine + Polymer.dart 带有 hashbang 的单页 Web 应用路由
使用Shady DOM document.getElementByID()的Polymer 2.0