我想知道如何在 angulardart 中使用（如果可能的话）dart:html。创建 angulardart 项目（待办事项列表）时，我在 webstorm 的默认示例中尝试它。
我尝试插入一些飞镖代码，但它不起作用。只有当我将它插入到 OnInit 自动实现的 ngOnInit 中时它才有效。这是唯一的方法吗？在 AngularDart 中使用 dart 管理 DOM 是正确的做法吗？ 我需要 AngularDart 来实现全功能路由系统
【问题讨论】：
标签： dart angular-dart dart-html
您可以通过多种方式获取 AngularDart 中的底层 dart:html 元素：
例如：
<div #myEl></div>
{{foo(myEl)}}
import 'dart:html';
@Component(...)
class ... {
foo(DivElement div) {
...
}
}
你也可以得到那个div视图ViewChild：
...
@ViewChild('myEl')
DivElement div;
...
您可以在组件的构造函数中请求它：
@Component(...)
class MyClass {
DivElement div;
MyClass(Element e) : div = e;
...
你可以实现“功能指令”，它根本没有类，而是在组件创建时调用 dart:html API：
@Directive(...)
void myFunctionalDirective(Element e) {
...
}
希望这些用例中的一个或多个满足您的需求。
请记住，每当您使用 dart:html 库时，您可能会做一些 AngularDart 无法跟踪的事情，并且您可能会遇到令人困惑的行为。最好让 angular 为您做尽可能多的事情，并且只使用 dart:html 作为一些小组件的“后端”，并让 angular 将它们连接在一起。但这是一个非常大的话题，可以写一本小书:)
【讨论】：
{{shown}}
.... ..冒着给你正确但有害的建议的风险，功能指令方法将是 @Directive(selector: "test-input") void neverWriteThisCode(Element e) { e.onClick((_) { document.getElementById('read- text').content = document.getElementById('test-input').value; }); }。这太糟糕了，除非你的情况非常非常特殊