作者:左右印象摄影 | 来源:互联网 | 2022-10-14 17:01
我将动态地将组件与服务中的另一个组件进行比较,首先,在服务工厂中同时对两个组件进行创建,然后创建可以访问ViewContainer的组件。但是无法创建组件!
服务内容:
@Injectable({
providedIn: 'root'
})
export class ModalService {
componentRef: ComponentRef;
constructor(private _modalService: BsModalService,
private resolver: ComponentFactoryResolver,
private injector: Injector) {
}
open(componentType: any) {
const cOntentFactory= this.resolver
.resolveComponentFactory(componentType);
const templateFactory = this.resolver
.resolveComponentFactory(ModalTemplateComponent);
const compOnentRef= templateFactory.create(this.injector);
componentRef.instance.container.createComponent(contentFactory);
this._modalService.show(componentRef.componentType, {class: 'modal-lg', initialState: {data: {test:true}});
}
}
零件 :
selector: 'lib-modal-template',
template: `
{{title}}
`,
styleUrls: ['./modal-template.component.css']
})
export class ModalTemplateComponent implements OnInit {
title:string;
@ViewChild('container', {read: ViewContainerRef, static: true}) container: ViewContainerRef;
}
例如:
this._modalService.open(NewUserForm,...);