2

我有一个包含两列的 ag-Grid:一个 ID 列和一个描述列。我在 TypeScript 类的 ngOnInit() 方法中的 columnDefs 中构造了这两列的列定义。

在描述列中,我使用 cellRendererFramework 在我的 ag-Grid 中呈现 routerLink。我使用 cellRendererParams 将一些必要的参数传递给我的 Angular 渲染器组件。在Description 列中,我需要访问ID 列的ID 值,并将其放入cellRendererParams 参数'resourceId'。我需要这个 ID 才能构建我的工作 RouterLink。

我怎样才能在下面的代码中做到这一点?

ngOnInit() {
  this.columnDefs = [

    // Column A - ID
    { 
        headerName: 'ID', 
        field: 'id', 
        width: 80, 
        sort: 'desc' 
    },

    // Column B - Description
    {
        headerName: 'Description',
        field: 'description',
        width: 150,
        cellRendererFramework: AgGridRouterLinkRendererComponent,
        cellRendererParams: {
            resourcePath: '/leverance/detail',
            resourceId: HERE-I-WOULD-LIKE-TO-ACCESS-THE-ID-VALUE-OF-THE-ID-FIELD-IN-THE-ID-COLUMN-ABOVE
    }

  ];
}
4

2 回答 2

4

我会像这样定义B列:

// Column B - Description
      {
        headerName: 'Description',
        field: 'description',
        width: 150,
        cellRendererFramework: AgGridRouterLinkRendererComponent,
        cellRendererParams(params) {
          return {
            resourcePath: '/leverance/detail',
            resourceId: params.data.id
          }
        }
      }

这样您就可以获得其他列中的任何字段。

于 2019-08-13T06:56:17.980 回答
0

我没有找到访问 columnDefs 中 ngOnInit() 中的 Id 值的方法。相反,我可以在 AgRendererComponent 的 agInit() 方法中得到它。

agInit(params: any): void { this.resourceId = params.data.id; }

ag-grid-router-link-renderer.component.ts

import { Component } from '@angular/core';
import { AgRendererComponent } from 'ag-grid-angular';

@Component({
  template: `
    <a [routerLink]="[params.resourcePath, resourceId]">{{
      params.value
    }}</a>
  `
})
export class AgGridRouterLinkRendererComponent implements AgRendererComponent {
  params: any;
  resourceId: number;
  agInit(params: any): void {
    this.params = params;
    this.resourceId = params.data.id;
  }
  refresh(params: any): boolean {
    return false;
  }
}
于 2018-12-30T13:50:58.943 回答