Question

我尝试在ag-grid单元格渲染器中进行单元格验证。

我无法做到这一点。

以下是我的代码示例。

columns = [
                    { headerName: "Sequence", field: "domainDetailSeq", cellRendererFramework: GridInputComponent },
                    { headerName: "Detail Id", field: "domainDetailId", cellRendererFramework: GridInputComponent }
                ]

这是单元格渲染器组件。

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

@Component({
    selector: 'child-cell',
    template: `<div fxLayout="row" class="grid-actions">
           <input required type="text" (blur)="invokeParentMethod($event)" [value]="params.value" [hidden]="params.data.createdBy && params.colDef.field==='domainDetailId'">
            <span [hidden]="!params.data.createdBy" *ngIf="params.colDef.field==='domainDetailId'">{{params.value}}</span>
        </div>`
})
export class GridInputComponent implements ICellRendererAngularComp {
    public params: any;

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

    public invokeParentMethod($event: MouseEvent, mode: string) {
        $event.preventDefault();
        this.params.context.componentParent.update(this.params, $event);
    }
}

我在主页面上有一个提交按钮，点击后，我需要执行所需的验证并在那里显示所需的消息。

任何建议都会很明显。

Answer 1

您可以在网格字段中使用cellClassRules属性：

configuration.cellClassRules:{'required-class':(params)=>{return <condition>}}

ag-grid细胞渲染器细胞验证

1 个答案: