首页 文章

找不到组件工厂 . 你有没有把它添加到@ NgModule.entryComponents？

提问于
浏览 175 次
5

在使用带有angular4的ag-grid时，我遇到了以下错误消息 .

我试图通过HTTP获取json后显示行数据 .

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

但是我的代码在下面显示错误消息 .

错误错误：找不到RedComponentComponent的组件工厂 . 你有没有把它添加到@ NgModule.entryComponents？

这是我的app模块代码 . 我已经设置为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 { }

error position of my code

我的问题 . 为什么此代码无法解析此组件 .

angular ag-grid

1 回答

  • 6

    从服务器加载数据时，您将 string 传递给ComponentFactoryResolver，但它应该是组件类型 .

    header.json

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

    要解决它，我会创建入口组件映射，如：

    entry-components.ts

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

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

    然后将加载从json字符串映射到组件类

    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];
       }
     });
    回复于

相关问题