我想手动编译一些包含指令的HTML。在Angular 2中相当于$ compile是什么?
例如,在Angular 1中,我可以动态编译一个HTML的片段并将其附加到DOM:
var e = angular.element('<div directive></div>'); element.append(e); $compile(e)($scope);
注意:由于@BennyBottema在注释中提及,DynamicComponentLoader现在已被弃用,因此这个答案也是如此。
原文链接:https://www.f2er.com/angularjs/146300.htmlAngular2没有任何$compile等效。你可以使用DynamicComoponentLoader
和hack with ES6类来动态编译你的代码(见plunk):
import {Component,DynamicComponentLoader,ElementRef,OnInit} from 'angular2/core' function compileToComponent(template,directives) { @Component({ selector: 'fake',template,directives }) class FakeComponent {}; return FakeComponent; } @Component({ selector: 'hello',template: '<h1>Hello,Angular!</h1>' }) class Hello {} @Component({ selector: 'my-app',template: '<div #container></div>',}) export class App implements OnInit { constructor( private loader: DynamicComponentLoader,private elementRef: ElementRef,) {} ngOnInit() {} { const someDynamicHtml = `<hello></hello><h2>${Date.now()}</h2>`; this.loader.loadIntoLocation( compileToComponent(someDynamicHtml,[Hello]) this.elementRef,'container' ); } }
但它只会工作,直到html解析器里面的angular2核心。