web-dev-qa-db-fra.com

Aucune usine de composants trouvée. L'avez-vous ajouté à @ NgModule.entryComponents?

Lors de l'utilisation d'ag-grid avec angular4, je suis coincé avec le message d'erreur ci-dessous.

J'essaie d'afficher les données de ligne après avoir récupéré json via HTTP.

this.gridOptions.api.setRowData(this.gridOptions.rowData);

Mais mon code fait un message d'erreur ci-dessous.

ERREUR Erreur: aucune fabrique de composants trouvée pour RedComponentComponent. L'avez-vous ajouté à @ NgModule.entryComponents?

Ceci est mon code de module d'application. J'avais déjà mis à entryComponents.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AgGridModule} from "ag-grid-angular/main";

import { AppComponent } from './app.component';
import { MyGridApplicationComponent } from './my-grid-application/my-grid-application.component';
import { RedComponentComponent } from './red-component/red-component.component';

@NgModule({
  imports: [
    BrowserModule,
    AgGridModule.withComponents(
      [RedComponentComponent]
    ),
    FormsModule,
    HttpModule
  ],
  declarations: [
    AppComponent,
    MyGridApplicationComponent,
    RedComponentComponent
  ],
  entryComponents: [
    RedComponentComponent
  ],  
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

position d'erreur de mon code

Ma question. Pourquoi ce code ne peut pas résoudre ce composant.

angularag-grid
7
sungyong

Vous passez string à `ComponentFactoryResolver lors du chargement des données à partir du serveur, mais il doit être de type composant.

header.json

{
  "headerName": "DetailCode",
  "field": "detailCode",
  "cellRendererFramework": "RedComponentComponent", // string
  "width":100
},

pour le résoudre, je créerais une carte de composants d'entrée comme:

entry-components.ts

import { RedComponentComponent } from './red-component/red-component.component';

export const entryComponentsMap = {
  'RedComponentComponent': RedComponentComponent
};

puis mapper le chargement de la chaîne json à la classe de composants

comm-code-grid-option.service.ts

private fetchColumnDefs() {
 console.log("fetchColumnDefs()");

 this.http.get(this.API_URI + "resident/header.json").subscribe(
   r => {
     this.gridOptions.columnDefs = r.json();
     this.gridOptions.columnDefs.forEach((x: any) => {
       if (x.cellRendererFramework) {
         x.cellRendererFramework = entryComponentsMap[x.cellRendererFramework];
       }
     });
7
yurzui