时间戳

首页 > 解决方案 > Angular：在 NgModule entryComponents 数组中使用库中的组件时出现问题

angular - Angular：在 NgModule entryComponents 数组中使用库中的组件时出现问题

问题描述

我在同一个项目中有一个库和一个展示模块。

库模块有一个PopoverService和一个PopoverComponent。

PopoverService使用PopoverComponent作为 Angular CDK ComponentPortal 构造函数的第一个参数：

弹出服务：

open(...) {
    new ComponentPortal(
                    PopoverComponent,
                    // ...
    )
}

Showcase 模块直接使用PopoverService（但不是PopoverComponent）。

Lib 模块是这样的：

@NgModule({
    declarations: [PopoverComponent],
    imports: [
        // ... other modules
        OverlayModule
    ],
    providers: [PopoverService],
    exports: [PopoverComponent]
})
export class MyLibModule { }

public-api.ts是这样的：

export * from './lib/my-lib.module';

展示模块是这样的：

import { PopoverComponent } from 'my-lib/lib/components/popover/popover.component';
@NgModule({
  // ... other
  imports: [
    // other modules
    MyLibModule
  ],
  entryComponents: [PopoverComponent]
})
export class ShowcaseModule { }

但是在调用 PopoverService.open() 时出现此错误：

./src/app/modules/showcase/showcase.module.ts
Module not found: Error: Can't resolve 'my-lib/lib/components/popover/popover.component' in '........./src/app/modules/showcase'

我究竟做错了什么？

标签： angular

解决方案

我错误地将 PopoverComponent 添加到了错误的模块中。不得不添加

entryComponents: [PopoverComponent]

在 Library 模块中而不是消费 Showcase 模块中。不过，由于@MikeOne 的宝贵建议，我不会删除这个问题。

推荐阅读