dart - 角 2 Dart : How to bind events correctly to dynamically generated HTML (Removing disallowed attribute )?

Question

我想将点击事件绑定(bind)到 Angular Dart 中动态生成的 HTML。如何正确执行？

我试过的:

home_component.dart:

void addHtml() {
 html = """
  <div class="offer" (click)="offerGo()">
   ....
  </div>""";

  offers.setInnerHtml(html);
}

void offerGo() {
 print("Offer clicked!");
}

HTML 已正确添加，但我在浏览器控制台中收到以下警告:

Removing disallowed attribute <DIV (click)="offerGo()">

...并且单击报价时不会触发单击事件。

Answer 1

无法为动态添加的 HTML 实例化属性或事件绑定(bind)或组件或指令。

Angular 不会处理以任何方式动态添加的 HTML。

Removing disallowed attribute

与 Angular 没有直接关系，而是简单的 dart:html .
另请参阅删除不允许的属性

您只能将事件处理程序强制添加到动态添加的 HTML:

void addHtml() {
 html = """
  <div class="offer">
   ....
  </div>""";

  offers.setInnerHtml(html);
  offers.querySelector('div.offer').onClick.listen(offerGo);
}

void offerGo() {
 print("Offer clicked!");
}