将组件动态插入html

我试图在一段html中动态插入一个角度材质组件。按照我的想法，我将无法使用

以下是它的工作原理：

我将从数据库中检索一个字符串（它可以是任何材质组件，如输入、按钮等…类似于以下内容：

let stringFromDB = "<md-spinner></md-spinner>"

让stringFromDB=“”

我需要将此字符串传递给我的html的div（这是我的“容器”）。因此我尝试：

@Component({
    selector: 'report',
    template: `<div [innerHtml]="stringFromDB"></div>`
})
export class ReportComponent{
    stringFromDB : string = null;

    constructor(){  
        this.stringFromDB =this.someService.getTemplateStringFromDatabase();
    }
}

@组件({
选择器：“报告”，
模板：``
})
导出类ReportComponent{
stringFromDB:string=null；
构造函数（）{
this.stringFromDB=this.someService.getTemplateStringFromDatabase（）；
}
}

我可以传递一个简单的

。

---

但不是像md spinner这样的组件。关于如何实现这一点，您有什么想法吗？

在angular 4中，您可以使用ngComponentOutlet

模板：

<ng-container *ngComponentOutlet="dynamicComponent; ngModuleFactory: dynamicModule;"></ng-container>

使用模板字符串生成动态模块和组件：

import { Compiler } from '@angular/core';

build() {
    this.dynamicComponent = this.createDynamicComponent(this.stringFromDB);
    this.dynamicModule = this._compiler.compileModuleSync(this.createDynamicModule(this.dynamicComponent));
}

createDynamicModule(componentType: any) {
    @NgModule({
        imports: [ ],
        declarations: [
            componentType
        ],
        entryComponents: [componentType]
    })
    class RuntimeModule { }
    return RuntimeModule;
}

createDynamicComponent(template: string) {
    @Component({
        selector: 'dynamic-component',
        template: template ? template : '<div></div>'
    })
    class DynamicComponent {
        constructor() {
        }
    }
    return DynamicComponent;
}

从'@angular/core'导入{Compiler}；
构建（）{
this.dynamicComponent=this.createDynamicComponent（this.stringFromDB）；
this.dynamicModule=this.\u compiler.compileModuleSync（this.createDynamicModule（this.dynamicComponent））；
}
createDynamicModule（组件类型：任意）{
@NGD模块({
进口：[]，
声明：[
组件类型
],
entryComponents:[组件类型]
})
类运行时模块{}
返回运行时模块；
}
createDynamicComponent（模板：字符串）{
@组成部分({
选择器：“动态组件”，
模板：模板？模板：“”
})
类DynamicComponent{
构造函数（）{
}
}
返回DynamicComponent；
}

我认为您需要编译它们，因为这是一个自定义组件