Как получить старое и новое значение динамически генерируемого столбца флажков в agGrid

Question

Я использую agGrid, где столбцы создаются динамически. Моя цель - получить старое значение и новое значение после установки флажков. Я пытаюсь использовать onCellValueChanged, но это не сработало. Если я использую onCellClicked, тогда я не получаю старое значение и новое значение.

Для вашего понимания я хочу иметь в виду под старым значением и новым значением, что если пользователь проверил, то старое значение ложно, а новое значение истинно .

HTML

<ag-grid-angular class="ag-theme-balham" [gridOptions]="siteJobDeptGridOptions"
            [rowData]="siteJobDeptRowData" [columnDefs]="siteJobDeptColDef" [paginationPageSize]=10 [domLayout]="domLayout"
            (gridReady)="onGridReady($event)">
        </ag-grid-angular>

Файл TS

export class SiteJobDeptConfigComponent implements OnInit {
ngOnInit() {
    this.domLayout = "autoHeight";                      
    this.getAllSiteJobConfig();      
    this.generateColumns();     
}

onGridReady(params: any) {            
    params.api.sizeColumnsToFit();
    params.api.resetRowHeights();                                        
}

generateColumns()
{
    let deptColDef = []; 

    let colSiteJob =  { 
            field: 'SiteJobName', headerName: 'Site Job Name',resizable: true,
            sortable: true, filter: true, editable: false, 
    }

    this.siteJobDeptCommonService.getEntityData('getpublisheddepts')
        .subscribe((rowData) => {  
            deptColDef.push(colSiteJob);                              
            for(let dept of rowData)
            {                                    
                deptColDef.push({ 
                    field: dept.DeptName, headerName: dept.DeptName, width:100,resizable: true,
                    cellClass: 'no-border',                                        
                    cellRenderer : params => {                        
                        var input = document.createElement('input');
                        input.type="checkbox";                        
                        input.checked=params.data[dept.DeptName];                       
                        return input;
                    },                    
                    onCellValueChanged: this.siteDeptCellValueChanged.bind(this),

                })
            }                            
        this.siteJobDeptColDef = deptColDef;              
    },
    (error) => { alert(error) });         
}

siteDeptCellValueChanged(dataCol: any) {    
    let checkedOldValue = "Old Check Value - " + dataCol.oldValue;   
    let checkedNewValue = "New Check Value - " + dataCol.newValue;                        
}

getAllSiteJobConfig()
{        
    let siteJobRowData = [];
    this.siteJobDeptCommonService.getEntityData('getallsitedeptjob')
        .subscribe((rowData) => {            
            for(let siteJobDetail of rowData)
            {               
                for(let deptAllow of siteJobDetail.DeptAllow)
                {
                    tempArray[deptAllow["DeptName"]] = deptAllow["IsAllow"];
                }

                siteJobRowData.push(tempArray); 
            }
            this.siteJobDeptRowData = siteJobRowData;
        },
        (error) => { alert(error) }); 
    }    
}

Сетка выглядит следующим образом: -

Не могли бы вы помочь мне, как получить значение старых и новых данных из флажка, который создается динамически?