Angular 4 : 컴포넌트 팩토리를 찾을 수 없습니다. @ NgModule.entryComponents에 추가하셨습니까?

Angular 4 : 컴포넌트 팩토리를 찾을 수 없습니다. @ NgModule.entryComponents에 추가하셨습니까?

---

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

어떻게 고칠 수 있습니까?

---

에 이것을 추가하십시오 module.ts.

declarations: [
  AppComponent,
  ConfirmComponent
]

ConfirmComponent가 다른 모듈에있는 경우 해당 모듈을 내 보내서 외부에서 사용할 수 있도록 추가해야합니다.

exports: [ ConfirmComponent ]

동적으로로드 된 컴포넌트의 경우 ComponentFactory를 생성하려면 컴포넌트를 모듈의 entryComponents에 추가해야합니다.

declarations: [
  AppComponent,
  ConfirmComponent
],
entryComponents: [ConfirmComponent],

entryComponents 정의에 따라

이 모듈을 정의 할 때 컴파일해야하는 구성 요소 목록을 지정합니다. 여기에 나열된 각 구성 요소에 대해 Angular는 ComponentFactory를 만들어 ComponentFactoryResolver에 저장합니다.

---

세부 사항을 참조하십시오 에 대해 entryComponent:

구성 요소를 동적으로로드하는 경우 declarations및 entryComponent다음 모두에 구성 요소를 넣어야합니다 .

@NgModule({
  imports: [...],
  exports: [...],
  entryComponents: [ConfirmComponent,..],
  declarations: [ConfirmComponent,...],
  providers: [...]
})

---

TL; DR :와 NG6에서 서비스 providedIn: "root"구성 요소가 첨가되지 않은 경우 ComponentFactory를 찾을 수 entryComponents의 app.module .

서비스에서 컴포넌트를 동적으로 작성하는 것과 함께 각도 6을 사용하는 경우에도이 문제가 발생할 수 있습니다!

예를 들어 오버레이 만들기 :

@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 에서이 서비스를 제공하는 definition .

So if your service is located in, for example, the "OverlayModule", where you also declared the OverlayExampleComponent and added it to the entryComponents, the service cannot find the ComponentFactory for OverlayExampleComponent.

---

I had the same issue. In this case imports [...] is crucial, because it won't work if you don't import NgbModalModule.

Error description says that components should be added to entryComponents array and it is obvious, but make sure you have added this one in the first place:

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

---

Add that component to entryComponents in @NgModule of your app's module:

entryComponents:[ConfirmComponent],

as well as Declarations:

declarations: [
    AppComponent,
    ConfirmComponent
]

---

Add 'NgbModalModule' in imports and your component name in entryComponents App.module.ts as shown below

---

I have the same problem with angular 6, that's what worked for me :

@NgModule({
...
entryComponents: [ConfirmComponent],
providers:[ConfirmService]

})

If you have a service like ConfirmService, have to be declare in providers of current module instead of root

---

Place components which are created dynamically to entryComponents under @NgModuledecorator function.

@NgModule({
    imports: [
        FormsModule,
        CommonModule,
        DashbaordRoutingModule
    ],
    declarations: [
        MainComponent,
        TestDialog
    ],
    entryComponents: [
        TestDialog
    ]
})

---

I had the same issue for bootstrap modal

import { NgbModal } from '@ng-bootstrap/ng-bootstrap';

If this is your case just add the component to the module declarations and entryComponents as other responses suggest, but also add this to your module

import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

imports: [
   NgbModule.forRoot(),
   ...
]

---

I had same issue in Angular7 when I create dynamic components. There are two components(TreatListComponent, MyTreatComponent) that needs to be loaded dynamically. I just added entryComponents array in to my app.module.ts file.

entryComponents: [
TreatListComponent,
MyTreatComponent

],

---

This error occur when you try to load a component dynamically and:

1. The component you want to load is not routing module
2. The component is no in module entryComponents.

in routingModule

const routes: Routes = [{ path: 'confirm-component', component: ConfirmComponent,data: {}}]

or in module

entryComponents: [
ConfirmComponent
} 

To fix this error you can add a router to the component or add it to entryComponents of module.

1. Add a router to component.drawback of this approach is your component will be accessible with that url.
2. Add it to entryComponents. in this case your component will not have any url attached to and it will not be accessible with url.

---

if you use routing in your application

make sure Add new components into the routing path

for example :

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

---

In my case I didn't need entryComponents at all - just the basic setup as described in the link below, but I needed to include the import in both the main app module and the enclosing module.

imports: [
    NgbModule.forRoot(),
    ...
]

https://medium.com/@sunilk/getting-started-angular-6-and-ng-bootstrap-4-4b314e015c1c

You only need to add it to entryComponents if a component will be included in the modal. From the docs:

You can pass an existing component as content of the modal window. In this case remember to add content component as an entryComponents section of your NgModule.

---

I was getting the same issue with ag-grid using dynamic components. I discovered you need to add the dynamic component to the ag-grid module .withComponents[]

imports: [ StratoMaterialModule, BrowserModule, AppRoutingModule, HttpClientModule, BrowserAnimationsModule, NgbModule.forRoot(), FormsModule, ReactiveFormsModule, AppRoutingModule, AgGridModule.withComponents(ProjectUpdateButtonComponent) ],

---

For clarification here. In case you are not using ComponentFactoryResolver directly in component, and you want to abstract it to service, which is then injected into component you have to load it under providers for that module, since if lazy loaded it won't work.

---

In case you have still the error after providing component dialog class in entryComponents, try to restart ng serve - it worked for me.

---

My error was calling NgbModal open method with incorrect parameters from .html

참고URL : https://stackoverflow.com/questions/46990389/angular-4-no-component-factory-found-did-you-add-it-to-ngmodule-entrycomponent