将指令附加到动态添加的元素

Question

当您使用另一个元素的ElementRef.nativeElement.innerHTML属性将带有指令的元素添加到 DOM 时，该指令不会触发。如何以导致指令触发的方式向 DOM 添加元素？

示例
如果在我的组件中，我执行以下操作：

export class AppComponent implements OnInit {

    constructor(private _elem: ElementRef) { }    

    ngOnInit() {
        this._elem.nativeElement.innerHTML = '<span myDirective>Foo</span>';
    }

}

（这是对我实际实现的主要简化，所以让我们暂时忽略这是不好的做法）

然后myDirective，似乎附加到<span>将永远不会实际运行。

问题是：我如何获得角度来识别带有指令的新元素，以便它运行？

Answer 1

动态编译已从 Angular 2+ 中删除。另一种替代方法是使用Dynamic Component Loader动态加载组件。为此，您必须更改现有的实现

https://angular.io/guide/dynamic-component-loader