我想创建动态组件并将这些组件的视图插入到容器中.
我认为这可以通过ViewContainerRef来实现.
但我不知道,我们能得到ViewContainerRef任何组件吗?如果是的话怎么样?我是Angular的新手,如果有任何其他好的解决方案可以处理这种情况,请建议我.
更新 我认为,我非常接近解决方案.下面是代码.
app.component.ts
import {Component} from '@angular/core';
import {ContainerComponet} from './container.component'
@Component({
selector: 'my-app',
template: `
<container> </container>
`,
directives: [ContainerComponet]
})
export class AppComponent {
constructor() { }
}
Run Code Online (Sandbox Code Playgroud)
container.component.ts
import {Component, ComponentResolver, ViewContainerRef} from '@angular/core'
import {controlBoxComponent as controlBox} from './controlBox.component';
@Component({
selector: 'container',
template: 'container'
})
export class ContainerComponet {
constructor(viewContainer: ViewContainerRef, private _cr: ComponentResolver) {
this._cr.resolveComponent(controlBox)
.then(cmpFactory => {
const ctxInjector = viewContainer.injector;
return viewContainer.createComponent(cmpFactory, 0, ctxInjector);
})
} …Run Code Online (Sandbox Code Playgroud)