angular.dart如何以编程方式创建自定义组件并添加到页面？ [英] angular.dart how to create a custom component programmatically and add to page?
问题描述
是否可以定义一个angular-dart组件，然后以编程方式创建该组件的实例并将其添加到您的网页？我希望可能会有这样：
Is it possible to define an angular-dart component and then programmatically create an instance of that component and add it to your web page? I'd hoped there might be something like:
import 'package:web_sandbox/web_sandbox.dart';
import 'package:angular/angular.dart' as ng;
void main() {
document.body.appendHtml('<web-sandbox-component></web-sandbox-component>');
var node = document.body.query('web-sandbox-component');
ng.compile(node);
}
是以编程方式创建一个有角度的Web组件并将其添加到页面，可能像上面的伪例子，如果是这样的话，
is there away of creating an angular web component programmatically and adding it to the page, maybe like the above pseudo-example, and if so how?
推荐答案
我不认为这是可能的Angular。
I don't think this is possible with Angular.
您可以在DOM中添加一个HTML标记< web-sandbox-component> 处理这个新的HTML，然后Angular将实例化这个标签的Angular组件（这是你链接的问题是关于）。
You can add an HTML tag <web-sandbox-component> into the DOM and tell Angular it should process this new HTML and then Angular would instantiate the Angular component for this tag (this is what the question you linked is about).
我不认为这是一个局限性。
I don't see this as a limitation. Is there something you would like to do that seems not possible this way?.
EDIT
您的main代码应该如下所示：
Your code in main should look like this:
我的文档看起来像
...
<body>
<div id="mydiv"></div>
...
</body>
并附加< web-sandbox-component> 到div
main() {
print('main');
ng.Injector inj = ngaf.applicationFactory().addModule(new MyAppModule()).run();
var node = dom.querySelector('#mydiv');
node.append(new dom.Element.html('<web-sandbox-component></web-sandbox-component>', validator: new dom.NodeValidatorBuilder()..allowCustomElement("web-sandbox-component")));
ng.Compiler compiler = inj.get(ng.Compiler);
ng.DirectiveMap directiveMap = inj.get(ng.DirectiveMap);
compiler(node.childNodes, directiveMap)(inj, node.childNodes);
}
这篇关于angular.dart如何以编程方式创建自定义组件并添加到页面？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
