ag-grid：水平向后和向前滚动后，在自定义单元格渲染器中发现服务未定义

Posted 2023-03-28

【中文标题】ag-grid：水平向后和向前滚动后，在自定义单元格渲染器中发现服务未定义

【英文标题】：ag-grid: services are found undefined in custom cell renderer after horizontally scrolling backward and forward

【发布时间】：2021-12-28 05:10:28

【问题描述】：

我在我的 agular 项目中使用 ag-grid。我正在使用在框架组件中定义的自定义单元格渲染器，例如

    public frameworkComponents = 
    statusrenderer: StatusRendererComponent,
    columnheaderrenderer: ColumnHeaderRendererComponent

单元格渲染器组件中的服务很少，例如 -

    constructor(
    protected readonly permissionService: NgxPermissionsService,
    private readonly translateService: LanguageTranslateService,
  ) 
  

问题是，第一次渲染单元格时，服务已正确初始化，但如果我水平滚动一段距离并返回服务对象，则会找到 undefined。

框架版本：

angular: ^10
ag-grid: ^26.1.0

【问题讨论】：

您需要显示错误发生位置的代码

【参考方案1】：

我不确定 ag-grid 如何实例化组件。然而，另一种方法是使用context 传递服务，如docs 中所述。例如：

网格组件：

@Component(
  selector: 'app-root',
  template: `
      <ag-grid-angular [context]="context" ...other properties>
      </ag-grid-angular>
  `
)
export class AppComponent 
  constructor(translateService: LanguageTranslateService) 
      this.context =  translateService ;
  

渲染器组件：

@Component(
  selector: 'status-renderer',
  template: `...`
)
export class StatusRendererComponent 
  private _translateService: LanguageTranslateService;

  agInit(params) 
      this._translateService = params.context.translateService;