相关疑难解决方法(0)

Angular2:从服务响应中动态加载组件

我知道这不是最好的解决方案,但我希望能够从JSON响应中动态加载组件,这些内容如下:

app.component

@Component({
    selector: 'my-app',
    template: '<h1>My First Angular 2 App</h1> {{component.title}} {{component.selector}}',
    providers: [AppService],
    directives: [ExampleComponent]
})
export class AppComponent implements OnInit {

    component:{};

    constructor(
        private _appService: AppService) {
    }

    ngOnInit() {
        this.component = this._appService.getComponent();
    }
}
Run Code Online (Sandbox Code Playgroud)

app.service

@Injectable()
export class AppService {

    component = {
        title: 'Example component',
        selector: '<example></example>'
    }

    getComponent() {
        return this.component;
    }
}
Run Code Online (Sandbox Code Playgroud)

example.component

@Component({
    selector: 'example',
    template: 'This a example component'
})
export class ExampleComponent  {
}
Run Code Online (Sandbox Code Playgroud)

如果我运行这个例子,我的输出是<example></example>但它实际上并没有呈现组件.我也尝试过使用[innerHtml]="component.selector",但这也行不通.有没有人有想法或建议?

angular

7
推荐指数
1
解决办法
2万
查看次数

标签 统计

angular ×1