Question

在我的ModalComponent中，我有以下内容：

_eventEmitterService.modal.subscribe(stream=>{
    var component = ModalTemplateComponent;
    stream.subscribe(msg=>{
        this.componentRef.dispose();
        this.componentRef = null;
    });
    this._dcl.loadIntoLocation(component,_elementRef, 'modal').then((componentRef)=>{
       this.componentRef = componentRef;
    });
})

效果非常好，直到我更新为Angular 17。

在更改日志中，我读过：

已删除DynamicComponentLoader.loadIntoLocation。使用 @ViewChild（'myVar'，读取：ViewContainerRef）来获取一个 ViewContainerRef在一个带有变量myVar的元素上。然后打电话 DynamicComponentLoader.loadNextToLocation

所以，据我所知，我需要补充一下：

@ViewChild('selector-modal') child:ModalComponent;

到包含ModalComponent的组件。

但是，我不确定如何在ModalComponent中加载我的新组件：

 this._dcl.loadIntoLocation(component,_elementRef, 'modal').then((componentRef)=>{
       this.componentRef = componentRef;
    });

在过去的angular-16版本中有什么相同的东西？

Answer 1

@ViewChild()应设置read参数：

@ViewChild('selector-modal', {read: ViewContainerRef}) child:ModalComponent;

加载nextToLocation应该如下所示：

this._dcl.loadNextToLocation(component, this.child).then((cmpRef) => {
  this.cmpRef = cmpRef;
});

另见Angular 2 dynamic tabs with user-click chosen components

更新动态组件加载器的问题

1 个答案: