Angular - ag-grid 更新'rowdata'

Question

我有以下角度网格：

calendar example

如果我编辑红色框中的日期，它应该会影响绿色框中的所有值。我不确定如何最好地做到这一点，你能建议吗？

我最初的想法是在编辑时触发一个函数，该函数从我已更改的项目中获取单元格引用，并在 rowdata 数组和相应的项目中更新它。有效刷新网格使用的“行数据”中的所有数据？

谢谢

Answer 1

默认情况下，单元格之间没有数据关系-您必须自己创建它。

例如 - 在您的数据存储中，您将有 start 和 end 日期，其他值 - 将基于它创建。

您可以通过ValuesSetter 和ValueGetter 实现这一目标

Example

总列 - 基于其他单元格值创建 - 通过附加函数。

所以你的情况是这样的：

colDef: [
    { field: 'startDate'},
    { field: 'endDate'},
    {
      headerName: 'Days',
      valueGetter: (params:any) => getDiffValueGetter(params),
    },
    {
      headerName: 'Weeks',
      valueGetter: (params:any) => getDiffValueGetter(params, true),
    },
]

const oneDayTime = 1000 * 60 * 60 * 24
const oneWeekTime = oneDayTime * 7;

getDiffValueGetter(params: any, isWeekDiff: boolean): number {
    const startDate = new Date(params.getValue('startDate')); //like value "06/30/2019";
    const endDate = new Date(params.getValue('endDate')); // "06/30/2020";

    //don't forget to get a Date object from value
    //so will show just an example of how could it be

    // To calculate the time difference of two dates
    const timeDiff = endDate.getTime() - startDate.getTime();

   // To calculate the no. of days/weeks between two dates
   return return parseInt(timeDiff / (isWeekDiff ? oneWeekTime : oneDayTime));
}

Working demo

P.S.它将与数据更新一起使用 - 一旦数据更新 - ValueGetter 将被触发并根据需要更新数据。