Exploring Angular with Typescript for the first time. I'm trying to access Class Level Variables within the onCellValueChanged event of agGrid, but encountering the following error:
Cannot read property 'updateDict' of undefined
Here's my TypeScript snippet:
import { Component, OnInit } from '@angular/core';
import { APICallService } from '../../.././PortalServices/webapicall.service';
@Component({
selector: 'master-gender',
templateUrl: 'app/PortalPages/MasterPages/GenderMaster/gender.component.html',
providers: [APICallService],
})
export class GenderComponent implements OnInit {
private updateDict = new Map();
genderRowData: [];
constructor(private genderService: APICallService) {
}
ngOnInit() {
this.genderService.getApiCall('getallgenders')
.subscribe((rowData) => this.genderRowData = rowData,
(error) => { alert(error) }
);
}
columnDefs = [
{
headerName: 'Gender Name', field: 'Name',
cellEditor: 'agLargeTextCellEditor',
cellEditorParams: {
maxLength: '100',
cols: '20',
rows: '2'
},
onCellValueChanged: this.genderCellValueChanged
},
]
genderCellValueChanged(event: any) {
let oldData = '';
//Error coming from below line
if (typeof (this.updateDict[event.data.GenderId + ',' + event.colDef.field]) != 'undefined')
oldData = this.updateDict[event.data.GenderId + ',' + event.colDef.field].OldData;
else
oldData = event.oldValue;
console.log(oldData);
}
}
- Any suggestions on how to resolve this issue?
- Can "genderCellValueChanged" method be moved to a child component (separate .ts file)? If so, could you provide detailed steps?