Hi Remy,
Thanks for contacting Syncfusion support.
We have validated the given sample and we have found that, for generating the dynamic column model is take some delay. So you are getting that mentioned error because the column model is not generate properly. So we have suggesting to use, the following code to resolve this issue.
ngOnInit(): void {
this.isCol =false;
// Get Employees data
this.afs.collection('/BusinessUnits/Ndm7YfzHa6WtMYNWnt5D/Departments/sLPxRdmqfxkyPCrKaMS6/Years/CrqKGMz1xOGusPA4ndPS/Employees', ref => ref.orderBy('busDate')).valueChanges().subscribe(result => {
// Store data in variable
this.employeesArray = result;
this.employeesArray.map(employee => {
// Convert timestamp to date
if (employee.busDate) {
employee.busDate = formatDate(employee.busDate.toDate(), 'yyyy-MM-dd', 'FR-fr');
}
// For each item, dynamically push to arrays
for (let i = 1; i <= Object.keys(employee.arrayOfWeeks).length; i++) {
// Dynamically create "months" array everytime a new month is encountered
if (this.months.indexOf(formatDate(employee.arrayOfWeeks['week' + i]['date'].toDate(), 'MMMM yyyy', 'FR-fr').toString()) < 0) {
if(this.months.length >0){
// push the new column here
this.newCol.push({headerText:'month' + this.months.length + 'Columns', columns: this['month' + this.months.length + 'Columns'] })
}
this.months.push(formatDate(employee.arrayOfWeeks['week' + i]['date'].toDate(), 'MMMM yyyy', 'FR-fr').toString());
}
//
// Dynamically create column models
this['month' + this.months.length + 'Columns'].push({
field: `arrayOfWeeks.week${i}.displayedText`,
headerText: formatDate(employee.arrayOfWeeks['week' + i]['date'].toDate(), 'd', 'FR-fr').toString(),
width: '40',
textAlign: 'Center',
maxWidth: '60'
});
}
});
(this.grid as any).columns = (this.grid as any).columns.concat(this.newCol); // merge the new column into grid column
(this.grid as any).refreshColumns(); // need to call refreshColumns for add new columns
});
In the above code example we have pushed new column in your data iteration function. We have merged the Grid column and your dynamic columns once your data iteration completed. We need to call ‘refreshColumns()’ method of update the column model into Grid. Please find the sample for your reference.
Please find the documentation for your reference.
Regards,
J Mohammed Farook
