在 ColumnDef cellEditorParams 下，值未使用最近的数据值更新 - ag-grid Angular

Question

我在列定义中使用 cellEditorParams 并在初始化列定义时为值使用 cellEditorParams，因为它显示为空，所以没有数据，但在一次服务调用后，我正在获取已归档值的数据，但视图未更新到最近的数据。当我在选项卡之间切换并返回并检查此处时，我的组件正在重新初始化，这次我可以看到数据已更新。

这是我定义列定义的方式：

  serviceObj: string[] = [];
  constructor(private myService: MyService) {
  this.myService.readCalls.subscribe(readCal => {
    this.serviceObj = readCal;
  })
 }
  
// Defining the Columns
  createColumnDefs() {
    this.columnDefs = [
      {
        headerName: 'Header 1', field: 'header1',
        headerTooltip: '',
        width: 250,
        menuTabs: [ 'filterMenuTab'],
        filterParams: {
          clearButton: true
        },
        editable: true,
        cellEditor: 'agRichSelectCellEditor',
        cellEditorParams: {
          required: true,
          values: this.serviceObj
        }
      },
      {
        headerName: 'Header 2', field: 'header2',
        headerTooltip: '',
        width: 200,
        menuTabs: [ 'filterMenuTab'],
        filterParams: {
          clearButton: true
        },
        editable: true
      }
     }
   ]

此处 serviceObj 变量在初始化列定义后获取值，但网格未使用最新值更新。那么有什么办法可以处理这种情况或任何建议将不胜感激。

Answer 1

功能运行良好，只需对分配 cellEditorParams 进行一些小的更改，但我不确定这些更改是如何深入工作的。但它正在处理以下更改。

serviceObj: string[] = [];
  constructor(private myService: MyService) {
  this.myService.readCalls.subscribe(readCal => {
    this.serviceObj = readCal;
  })
 }
  
 private getValArray() {
  return {
      values: this.serviceObj
  };
}
 
// Defining the Columns
  createColumnDefs() {
    this.columnDefs = [
      {
        headerName: 'Header 1', field: 'header1',
        headerTooltip: '',
        width: 250,
        menuTabs: [ 'filterMenuTab'],
        filterParams: {
          clearButton: true
        },
        editable: true,
        cellEditor: 'agRichSelectCellEditor',
        cellEditorParams: this.getValArray.bind(this)
      }
      },
      {
        headerName: 'Header 2', field: 'header2',
        headerTooltip: '',
        width: 200,
        menuTabs: [ 'filterMenuTab'],
        filterParams: {
          clearButton: true
        },
        editable: true
      }
     }
   ]

Answer 2

Yuu 需要等到 read Calls promise 解决。基本上在 promise resolve 之后设置列函数。

this.myService.readCalls.subscribe(readCal => {
this.serviceObj = readCal;
this.columnDefs = this.createColumnDefs()
})
createColumnDefs() {
return [
  {
    headerName: 'Header 1', field: 'header1',
    headerTooltip: '',
    width: 250,
    menuTabs: [ 'filterMenuTab'],
    filterParams: {
      clearButton: true
    },
    editable: true,
    cellEditor: 'agRichSelectCellEditor',
    cellEditorParams: this.getValArray.bind(this)
  }
  },
  {
    headerName: 'Header 2', field: 'header2',
    headerTooltip: '',
    width: 200,
    menuTabs: [ 'filterMenuTab'],
    filterParams: {
      clearButton: true
    },
    editable: true
  }
 }
 ]

在 ColumnDef cellEditorParams 下，值未使用最近的数据值更新 - ag-grid Angular

Under ColumnDef cellEditorParams values are not updating with recent data values - ag-grid Angular

ag-grid

angular