0 
@Component({
   selector: 'dynamic',
   template: '<ng-template *ngFor="let portal of portals" [cdkPortalOutlet]="portal"></ng-template>',
   // entryComponents before Ivy
   entryComponents: [Component1, Component2, Component3]
})
class DynamicComponent<T extends BaseComponentClass>() {
    portals: ComponentPortal<any>[] = [];

    constructor(@Inject(COMPONENTS_TOKEN) components: T[]) {
        // Something like this
        this.portals = components.map(c => new ComponentPortal(c));
    }
}

@NgModule({
    declarations: [
        DynamicComponent
        Component1,
        Component2,
        Component3,
    ],
    imports: [PortalModule, CommonModule, MyOtherModule]
})

我有一个类似上面的组件，我使用ComponentPortaland动态创建cdkPortalOutlet。它DynamicComponent本身有许多它创建的出口和组件。以前entryComponents我会列出可以加载到DynamicComponents插座中的每个组件。这按预期工作，但现在升级到 Ivy 并删除 deprecated 后entryComponents，这不再有效。我创建DynamicComponent并且它初始化很好，但是内部的组件DynamicComponent似乎没有被创建并导致整个DynamicComponent渲染失败。如果我删除其中的插座，DynamicComponent则其他所有内容都可以DynamicComponent正常呈现。

我的想法是 DynamicComponent 的依赖组件在创建时没有解决。依赖组件不用于任何其他角度组件。我是否遗漏了有关如何将旧的 entryComponent 行为转换为与 Ivy 一起使用的内容？

编辑： "buildOptimizer": false修复它，但理想情况下希望保持这种状态。

4

1 回答 1

0

您可以在您的类中创建一个entryComponents数组，在DynamicComponent其中列出未在其他地方引用的组件，例如：

class DynamicComponent<T extends BaseComponentClass>() {
    entryComponents = [Component1, Component2, Component3];
    ...

组件被引用的事实将防止它们被摇树，即使该变量没有用于任何事情。在这个Angular GitHub 问题上查看有关此类问题和可能解决方案的有趣讨论。

于 2020-04-22T08:24:11.290 回答