Kendo Ui drilldown charts example is not working

[Sujith]

https://www.telerik.com/kendo-angular-ui/components/charts/drill-down/

 

Error: src/app/dashboard/dashboard.component.html:20:23 - error TS7053: Element implicitly has an 'any' type because expression of type 'any' can't be used to index type '{ "Company A": { product: string; sales: number; }[]; "Company B": { product: string; sales: number; }[]; }'.

20               [data]="productData[company]"
                         ~~~~~~~~~~~~~~~~~~~~
 

[Martin Bechev]

Hi Sujith,

Thank you for the provided feedback.

The error is thrown because of the strict template of the TypeScipt and that the productData doesn't have a type but we are trying to access inner fields on the HTML template. 

To fix the error try providing a type to productData like:

  interface ProductData {
    [key: string]: any[];
  }

 public productData: ProductData = {
        'Company A': [{
            product: 'Product 1',
            sales: 80
        }, {
            product: 'Product 2',
            sales: 20
        }],
        'Company B': [{
            product: 'Product 1',
            sales: 40
        }, {
            product: 'Product 2',
            sales: 160
        }]
    };

I hope this helps.

Regards,
Martin
Progress Telerik