自定义Polymer元素在Dart中扩展AElement [英] Custom Polymer element extending AElement in Dart

问题描述

我想创建自定义Polymer元素'ab-btn'，它扩展了一个元素。它应该用作：

I'd like to create custom Polymer element 'ab-btn' which extends 'a' element. It should be used as:

<ab-btn href="http://www.gooogle.com">Google</ab-btn>

我的聚合物元素的html声明看起来像（脚本列在结尾，因为我想声明一个文件中有更多元素）：

my html declaration of polymer element looks like (script is listed at the end, because I want to declare more elements in one file):

<polymer-element name="ab-btn" extends="a">
  <template>
    <content></content>
  </template>
</polymer-element>

<script type="application/dart" src="ab-elements.dart"></script>

和dart脚本的元素如下：

and dart script for the element is like:

import 'package:polymer/polymer.dart';
import 'dart:svg';

@CustomTag('ab-btn')
class AbBtn extends AElement {
  AbBtn.created() : super.created();

  var inputMethodContext;
}

当我尝试使用这个元素时，我总是遇到错误：

When I try to use this element I always get error:

#13     _ZoneDelegate.run (dart:async/zone.dart:417)
#14     _CustomizedZone.run (dart:async/zone.dart:627)
#15     initPolymer (package:polymer/src/loader.dart:37:33)
#16     main (package:polymer/init.dart:23:22)


Exception: InvalidCharacterError: Internal Dartium Exception
  undefined (undefined:0:0)

扩展'a'元素的正确方法是什么？

What is the proper way of extending 'a' elements?

推荐答案

> with Polymer，Observable

You should add with Polymer, Observable

@CustomTag('ab-btn')
class AbBtn extends AElement with Polymer, Observable {
  AbBtn.created() : super.created() {
    super.polymerCreated(); // <== also important for elements that extend DOM elements
  }
}

当您使用元素

<a is="ab-btn" href="http://www.gooogle.com">Google</a>

或通过代码创建元素：

var elm = new Element.tag('a', 'ab-btn');

这篇关于自定义Polymer元素在Dart中扩展AElement的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！