如何根据Angular 6同一行中的其他单元格值在AG-Grid选择下拉列表中加载不同的选项？

Posted 2023-03-28

【中文标题】如何根据Angular 6同一行中的其他单元格值在AG-Grid选择下拉列表中加载不同的选项？

【英文标题】：How to load different options in AG-Grid select dropdown ,based on other cell value in the same row with Angular 6?

【发布时间】：2019-08-13 11:12:50

【问题描述】：

我在列定义中使用了以下代码：

  headerName: 'Part', field: 'part', 
    cellStyle: 'background-color': 'cyan', editable: true, 
    cellEditor:'agSelectCellEditor', cellEditorParams: 

我在网格中还有其他列-

    headerName: 'Colour', field: 'colour', 
    cellStyle: 'background-color': 'cyan', editable: true, 
    cellEditor:'agSelectCellEditor', cellEditorParams: function(params)  
    var selectedPart = params.data.type; if (selectedPart==='R&S')  
    return  values: this.partTypeListRS ;  else if(selectedPart==='WiFi') 
     return  values: this.partTypeListWifi ;  else 
    if(selectedPart==='Other')  return  values: this.partTypeListOther ; 
    ,
    

如果我单击满足 selectedPart==='R&S' 条件的行并分别满足所有其他条件，我收到错误无法读取未定义的 this.partTypeListRS 属性。

【问题讨论】：

agSelectCellEditor dynamic list的可能重复

【参考方案1】：

您可以定义 cellEditorParams 函数，根据另一列的值返回不同的值。

这是来自 ag-grid 网站的示例 -

cellEditor : 'agSelectCellEditor';
cellEditorParams: function(params) 
    var selectedCountry = params.data.country;
    if (selectedCountry==='Ireland') 
        return 
            values: ['Dublin','Cork','Galway']
        ;
     else 
        return 
            values: ['New York','Los Angeles','Chicago','Houston']
        ;
    

看看这个来自官方文档的example。

【讨论】：

cellEditor:'agSelectCellEditor', cellEditorParams: function(params) var selectedPart = params.data.rs_or_wifi; if (selectedPart==='R&S') return values: this.partTypeListRS ; else if(selectedPart==='WiFi') return values: this.partTypeListWifi ; else if(selectedPart==='Other') return values: this.partTypeListOther ; ,

【参考方案2】：

我使用箭头函数 (params)=> 而不是 function(params) ，然后我可以在 CellEditorParams 中访问它