How to show dynamic values in ag-grid cell editor select

问题

I want to show dynamic drop down options for each row of ag-grid.

Suppose for each row, department might be different and based on that I plan to filter list of subjects (available option for users to select in dropdown)

Here is my code:

this.gridOptions.columnDefs = {
            headerName: 'Department',
            field: 'financingCurrency',
            editable: false,                            
            suppressSorting: false,
            cellClass: 'grid-align'
        },

        {
            headerName: 'Subject',
            field: 'subject',
            editable: true,
            cellEditor: 'select',
            filter: 'text',
            cellEditorParams: {
                values: this.subjects;                    
            },
            suppressSorting: false,
            cellClass: 'grid-align'
        }
}

I am using free version of ag-grid with Angular 2.

Does someone have any idea about it?

回答1:

If I understand correctly, you want to be able to have different values in the cellEditor based on which department is selected. If that is correct, then you will likely need to do something more complicated dealing with cellEditors. Here is a plnkr that I made that checks if the name starts with a J, if so then it allows a third option.

Please refer to the plnkr for full example, as well as the docs to make sure that you get everything imported/exported in the right places. Here is what is the key importance for you beyond what is on the docs:

agInit(params: any): void {
    if (params.node.data.financingCurrency == 'Your Super Department') {
        subjects = [...super options...]
    } else {
        subjects = [...different options...]
    }
}

agInit gets called any time editing is started. params has a complicated object, (I suggest console.log()ing it just to see everything that is available to you) but basically the node is referring to the row that the cell is on, and the data is the data for that row, and judging by your colDefs you can get the value of the Department from financingCurrency.

来源：https://stackoverflow.com/questions/43472174/how-to-show-dynamic-values-in-ag-grid-cell-editor-select

标签

html

angular

typescript

ag-grid