Typescript and Angular2 -highcharts: the 'series' property does not exist in the 'Object' type

Question

When I try to implement the next plunkr in Angular, I get the following error message.

Property 'series' does not exist on type 'Object'.

http://plnkr.co/edit/OQSFSKisIIWAH0megy4d?p=preview

I installed "angular2-highcharts": "^ 0.5.5", and typing "@ types / highcharts": "^ 5.0.5",

Any help would be appreciated.

Answer 1

The compiler does not know whether the property is present seriesin this.optionsas you type it as Object.

To overcome this, you can either remove the typing for the property (lazy output):

class AppComponent {

    options: any;
}

, , this.options :

class AppComponent {

    options = {
        chart: {
            zoomType: 'xy'
        },
        series: ...
        // ...
    };
}

options :

interface Options {
    series: any[], // Should be typed to the shape of a series instead of `any`
    // and type other props like "chart", "title"
}
class AppComponent {

    options: Options;

    constructor() {
        this.options = {
            chart: {
                zoomType: 'xy'
            },
            series: ...
            // ...
        };
    }
}

Answer 2

, -

export class DemoComponent {
  chart: Chart;

,

this.chart = new Chart({
  ...,
  series: [
    {
      name: 'Line 1',
      data: [1, 2, 3],
      type: 'line'
    }
  ]
});