Error when using Datagrid

Hi experts,

i have a web-sdk 1018.0.37 application using ad datagrid. Everything looks good to me but I get the follwoing error:

ERROR TypeError: Cannot read properties of undefined (reading 'length')
    at DataGridComponent_Template (ɵcmp.js:336:5)
    at executeTemplate (core.mjs:12199:9)
    at refreshView (core.mjs:12062:13)
    at refreshComponent (core.mjs:13157:13)
    at refreshChildComponents (core.mjs:11852:9)
    at refreshView (core.mjs:12112:13)
    at refreshComponent (core.mjs:13157:13)
    at refreshChildComponents (core.mjs:11852:9)
    at refreshView (core.mjs:12112:13)
    at refreshEmbeddedViews (core.mjs:13111:17)

When I remove the datagrid component the error is gone. I never reaches my service call etc.

html

<div class="aggregation-table">
    <c8y-data-grid
    [title]="title"
    [columns]="columns"
    [rows]="data"
    class="content-fullpage d-flex d-col border-top border-bottom"
  ></c8y-data-grid>
</div>
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subscription } from 'rxjs';
import { MonthPickerService } from '../../utitities/statistics-action-bar/month-picker/month-picker.service';
import { DeviceStatisticsService } from '../device-statistics.service';
import { gettext } from '@c8y/ngx-components';
import {
  Column,
  CoreModule
} from "@c8y/ngx-components";
import { DeviceGridModule } from "@c8y/ngx-components/device-grid";          

@Component({
  selector: 'device-aggregation',
  templateUrl: './device-aggregation.component.html',
  styleUrls: ['./device-aggregation.component.css'],
  imports: [CoreModule, DeviceGridModule],
})
export class DeviceAggregationComponent implements OnInit, OnDestroy {
 
  constructor(
    private monthPickerService: MonthPickerService,
    private deviceStatisticsService: DeviceStatisticsService,
  ) { }

  monthChangedSubscription: Subscription
  data= [
    {
      "className": "Class A",
      "avgMinMea": 0,
      "avgMaxMea": 24,
      "monthlyThreshold": 200,
      "count": 6187
    },
    {
      "className": "Class B",
      "avgMinMea": 24,
      "avgMaxMea": 144,
      "monthlyThreshold": 200,
      "count": 110
    },
    {
      "className": "Class C",
      "avgMinMea": 144,
      "avgMaxMea": 1440,
      "monthlyThreshold": 50,
      "count": 620
    },
    {
      "className": "Class D",
      "avgMinMea": 1440,
      "avgMaxMea": 8640,
      "monthlyThreshold": 50,
      "count": 65
    },
    {
      "className": "Class E",
      "avgMinMea": 8640,
      "avgMaxMea": 86400,
      "monthlyThreshold": 50,
      "count": 8
    },
    {
      "className": "Class F",
      "avgMinMea": 86400,
      "avgMaxMea": "INFINITY",
      "monthlyThreshold": 50,
      "count": 0
    }
  ];

  deviceData: any;
  

  title = "Device Aggregation";


  columns: Column[] = [
    {
      name: "className",
      header: "Device Class",
      path: "className",
      filterable: true,
    },
    {
      name: "avgMinMea",
      header: "Min Mea",
      path: "avgMinMea",
      filterable: true,
    },
    {
      name: "avgMaxMea",
      header: "Max Mea",
      path: "avgMaxMea",
      filterable: true,
    },
    {
      name: "count",
      header: "Total",
      path: "count",
      filterable: true,
    },
  ];

  ngOnInit(): void {
    
    try {
      this.monthChangedSubscription = this.monthPickerService.dateChanged.subscribe(async (selectedDate: Date) => {
       this.deviceData = await this.deviceStatisticsService.getMonthlyDeviceAggregation(selectedDate)
       console.log("###### Data: " + JSON.stringify(this.data))
    //   this.data = this.deviceData['totalDeviceClasses'] removed for static content
      })
    
    }
    catch (err) {
      console.log(gettext('Error creating table'))
      console.error(err.message)
    }
  }

  ngOnDestroy(): void {
    if (this.monthChangedSubscription) {
      this.monthChangedSubscription.unsubscribe()
    }
  }
}

Any hint would really help me.

Thanks,

Marco