У меня есть простая настройка таблицы AG-Grid + Angular 5, и я бы хотел, чтобы AG Grid выполнил следующие вычисления в той же строке.
Формула
а * б = с
б = с / а
Однако я не очень успешен в использовании valueGetters. Я считаю, что в итоге получаю какой-то эффект пинг-понга. Ошибок не возникает, но как только я пытаюсь изменить b или c, получаю странные результаты.
Я перечисляю свои фрагменты кода ниже. Есть ли у кого-нибудь идеи, как это решить?
app.component.html
<ag-grid-angular
#agGrid style = "width: 100%; height: 350px;"
class = "ag-theme-balham"
[gridOptions] = "gridOptions"
[columnDefs] = "columnDefs"
[showToolPanel] = "showToolPanel"
[defaultColDef] = "defaultColDef"
[rowData] = "rowData">
</ag-grid-angular>
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
private columnDefs;
private rowData;
private defaultColDef;
constructor() {
this.columnDefs = [
{ headerName: 'a', field: 'a', editable: false },
{
headerName: 'b',
field: 'b',
valueGetter: this.numCalc
},
{
headerName: 'c',
field: 'c',
valueGetter: this.resCalc
}
];
this.rowData = [
{ a: 10, b: 1, c: 10 },
{ a: 20, b: 2, c: 40 },
{ a: 30, b: 3, c: 90 }
];
this.defaultColDef = { editable: true }
}
resCalc(params) {
return params.data.a * params.data.b;
}
numCalc(params) {
return params.data.c / params.data.a;
}
}





Я бы порекомендовал вам вместо этого использовать сделка.
Ниже приведен пример gridOptions для вашего случая:
this.gridOptions = <GridOptions> {
getRowNodeId: params => params.a,
onCellEditingStopped: params => {
const { a } = params.node.data;
if (params.column.getColId() === 'b') {
const data = { a, b: parseInt(params.value, 10), c: a * params.value };
this.gridOptions.api.updateRowData({ update: [data] })
} else if (params.column.getColId() === 'c') {
const data = { a, b: params.value / a, c: parseInt(params.value, 10) };
this.gridOptions.api.updateRowData({ update: [data] })
}
}
};
Не беспокойтесь, обратите внимание, что вам также следует удалить свой valueGetter, чтобы избежать путаницы.
Большое спасибо, я попробую ваш подход.