angular中引入highcharts作为独立module的问题

一开始直接在app.module中使用highchargs是没问题的。

后来把highcharts单独放在一个公共的module中，就一直起不来，报如下的错误：

日志大概如下：

[Highcharts]="Highcharts"
~~~~~~~~~~~~~~~~~~~~~~~~~
error NG8002: Can't bind to 'constructorType' since it isn't a known property of 'highcharts-chart'.
1. If 'highcharts-chart' is an Angular component and it has 'constructorType' input, then verify that it is part of this module.
2. If 'highcharts-chart' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

 

HTML中代码如下：

<highcharts-chart 
    [Highcharts]="Highcharts"

    [constructorType]="chartConstructor"
    [options]="chartOptions"
    [callbackFunction]="chartCallback"

    [(update)]="updateFlag"
    [oneToOne]="oneToOneFlag"
    [runOutsideAngular]="runOutsideAngularFlag"

    style="width: 100%; height: 100%; display: block;"
></highcharts-chart>

 

component的TS中：

import * as Highcharts from 'highcharts';

 

解决办法：

在公共module文件中，导入一下highcharts的module

import { HighchartsChartModule } from 'highcharts-angular';

然后imports一下：

imports: [
    ...,
    HighchartsChartModule
  ]