如何禁用Ag-Grid中的整个列

问题描述

我要根据列包含onCellClicked事件的特定条件禁用整个列，但我不希望它触发

I want to disable entire column based on specific condition that column contains onCellClicked event but i don't want it to fire

推荐答案

您必须定义

For display handling, you need to create cellRenderer

要进行编辑处理，您需要创建自己的：

cellRenderer -复选框将显示为图标

cellRenderer - checkbox would be displayed as an icon

import {Component} from "@angular/core";
import {ICellRendererAngularComp} from "ag-grid-angular";

@Component({
    selector: '',
    template: `
    <div class="checkbox-container">
        <span *ngIf="params.value == true" title='true' class='ag-icon ag-icon-tick content-icon'></span>
        <span *ngIf="params.value == false" title='false' class='ag-icon ag-icon-cross content-icon'></span>
        <span *ngIf="!params.value"></span>
    </div>
    `
})
export class CheckboxRendererComponent implements ICellRendererAngularComp {
    private params: any;

    agInit(params: any): void {
        this.params = params;
    }

    refresh(params):boolean{
      return true;
    }
}

cellEditor -双击单元格将提供编辑模式（如果可能的话，基于 colDef - editable 属性）

cellEditor - double click on the cell will provide edit mode (if its possible, based on colDef- editable property)

import {Component} from "@angular/core";
import {ICellEditorAngularComp} from "ag-grid-angular";

@Component({
    selector: '',
    template: `<input type="checkbox"  [(ngModel)]="checkboxValue">`,
})

export class ChekboxEditorComponent implements ICellEditorAngularComp {

    private params: any;
    private checkboxValue:boolean;


    agInit(params: any): void {
        this.params = params;
        this.checkboxValue = this.params.value;
    }

    refresh(params):boolean{
      return true;
    }

    getValue(){
      return this.checkboxValue;
    }
}

最后一件事：
editable：（params）=> {return params.node.data.checkbox！= true}

这里有一种逻辑，该逻辑将对列

here there is a logic which will disable edit mode for true values in column

这篇关于如何禁用Ag-Grid中的整个列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！