Question

我正在尝试在我的Dart代码中实例化Polymer元素。

这是我的元素：

@CustomTag('card-component')
class CardComponent extends PolymerElement {
  @published
  String playerName;

  CardComponent.created() : super.created();
}

到目前为止，我找到工作的唯一方法是：

Element y = new Element.tag('card-component');

但我真正想做的是，通过访问者访问我的组件的值（而不是HtmlElement的属性）。有没有办法直接在Dart中实例化CardComponent而不使用Element.tag方式？我尝试以多种方式使用CardComponent.created()方法，但它也不起作用。

如果您想知道我为什么要这样做，那么我想将参数传递给我的构造函数，或者甚至使用工厂在理想的世界中创建组件。

编辑：阅读this answer后，我最终能够做我想做的事。我只需要将其添加到我的组件中

factory CardComponent(String playerName) => document.createElement("card-component")
  ..attributes = {
    "playerName" : playerName
};

然后像这样实例化它：

CardComponent myNewCard = new CardComponent("Pacane");

Answer 1

我不知道你的意思是什么＆＃34;通过访问者访问我的组件的值（而不是HtmlElement的属性）＆＃34;

(new Element.tag('card-component') as CardComponent)
    ..playerName = 'blabla';

添加自定义工厂构造函数允许您像使用普通构造函数一样使用该元素

@CustomTag('card-component')
class CardComponent extends PolymerElement {
  @published
  String playerName;

  CardComponent.created() : super.created();

  factory CardComponent CardComponent() {
    return new Element.tag('card-component');
  }
}

var cc = new CardComponent()..playerName = 'blabla';

如果您想从main()而不是从其他组件中执行此操作，请确保main()包含Polymer（初始化代码why am I getting type error on polymer.dart element?，how to implement a main function in polymer apps）

通过dart代码实例化聚合物元素

1 个答案: