我使用的是带有webpack的Angular 4模板 当我尝试使用一个组件(ConfirmComponent)时,我有这个错误:

没有为ConfirmComponent找到组件工厂。你加进去了吗 @NgModule.entryComponents吗?

该组件在app.module.server.ts中声明

@NgModule({
  bootstrap: [ AppComponent ],
  imports: [
    // ...
  ],
  entryComponents: [
    ConfirmComponent,
  ],
})
export class AppModule { }

还有app。module。browser。ts和app。module。shared。ts

我该怎么解决呢?


当前回答

如果在应用程序中使用路由

确保在路由路径中添加新组件

例如:

    const appRoutes: Routes = [
  { path: '', component: LoginComponent },
  { path: 'home', component: HomeComponent },
  { path: 'fundList',      component: FundListComponent },
];

其他回答

我也有同样的问题。在这种情况下进口[…]]是至关重要的,因为如果你不导入NgbModalModule,它将无法工作。

错误描述说组件应该添加到entryComponents数组中,这是显而易见的,但请确保您已经在第一个位置添加了这个:

imports: [
    ...
    NgbModalModule,
    ...
  ],

TL;DR: ng6中带有providedIn: "root"的服务在app.module的entryComponents中没有添加组件时,无法找到ComponentFactory。

如果你在使用angular 6的同时在服务中动态创建组件,也会出现这个问题!

例如,创建一个Overlay:

@Injectable({
  providedIn: "root"
})
export class OverlayService {

  constructor(private _overlay: Overlay) {}

  openOverlay() {
    const overlayRef = this._createOverlay();
    const portal = new ComponentPortal(OverlayExampleComponent);

    overlayRef.attach(portal).instance;
  }
}

问题在于

提供于:“根”

定义,它在app.module中提供此服务。

因此,如果你的服务位于,例如,“OverlayModule”中,在那里你也声明了OverlayExampleComponent并将其添加到entryComponents中,该服务无法为OverlayExampleComponent找到ComponentFactory。

我可能稍后再回复。但是对于那些仍然在寻找这个问题的解决方案并且在他们的代码中有这个的人来说,删除这个可能是有帮助的。我们在tsconfig中有以下条目。json文件:

  "angularCompilerOptions": {
    "enableIvy": false
  }

我们也面临同样的问题。经过大量的实验,我们从tsconfig.json中删除了这个块。现在我们的代码不再抱怨这个问题了。

入口组件是至关重要的。以上答案是正确的。

但是…

如果您正在提供打开模式(一种常见模式)的服务 你的模块定义了对话框组件没有加载到AppModule中,你需要将providedIn: 'root'更改为providedIn: MyModule。作为一般的良好实践,你应该对模块中的所有对话服务使用providedIn: SomeModule。

将该组件添加到应用模块的@NgModule的entryComponents中:

entryComponents:[ConfirmComponent],

以及声明:

declarations: [
    AppComponent,
    ConfirmComponent
]