Angular ag-grid 单元格渲染器复选框未刷新值

Question

我为复选框输入创建了单元格渲染器，但是当我单击复选框时，它会更改单元格内部的值，但不会更改单元格上的值。

参见 plunker 示例：Plunker

refresh 方法应该在更改时调用，但不知何故不是。

onCellClicked 函数 returns 无论我如何点击复选框仍然是相同的值。

我尝试 cellEditor: 'agRichSelect' 有两个可能的值 true 和 false，效果很好，但我需要复选框。

感谢任何想法！

Answer 1

，要跟踪 ngModel 的变化，您需要使用 (ngModelChange) 而不是 (onChange).

Second，你不应该使用 params.value 进行 ngModel 绑定，params - 是 grid 的一部分，所以不要混在一起，分开保存。

Third，在 cellRenderer 内的 refresh 函数中，你不应该更新 params，refresh grid.

内部使用的函数

// Mandatory - Get the cell to refresh. Return true if the refresh succeeded, otherwise return false.
// If you return false, the grid will remove the component from the DOM and create
// a new component in its place with the new values.
refresh(params: any): boolean;

Fourth，如果你想更新 cellRenderer 中的值，你应该使用 ICellEditorComp 接口而不是 ICellRendererComp(ICellRendererAngularComp 和 ICellEditorAngularComp 在 Angular 案例中）

Fifth，您忘记在 columnDefs

中设置复选框字段 editable: true

最后一个 - 您刚刚创建了复选框（在 grid 范围之外），它看起来像一个工作示例，但它不是。

如果 ag-grid，您需要了解完整的编辑过程，因此请在此处查看有关 cell rendering, cell editing 等的详细信息。

并且 here you can see how exactly 自定义复选框渲染器将起作用：

function booleanCellRenderer(params) {
    var valueCleaned = booleanCleaner(params.value);
    if (valueCleaned === true) {
        return "<span title='true' class='ag-icon ag-icon-tick content-icon'></span>";
    } else if (valueCleaned === false) {
        return "<span title='false' class='ag-icon ag-icon-cross content-icon'></span>";
    } else if (params.value !== null && params.value !== undefined) {
        return params.value.toString();
    } else {
        return null;
    }
}

Angular ag-grid 单元格渲染器复选框未刷新值

Angular ag-grid cell renderer checkbox not refresh value

cellrenderer

ag-grid

ag-grid-ng2

angular