web-dev-qa-db-ja.com

Angular 2-AOT-関数 'ChartModule'を呼び出しています、関数呼び出しはサポートされていません

私はこれで頭と髪を失っています。 HighChartsをAngular 2でインポートしていますが、追加のライブラリのいくつかが必要です。これまでのところ、私のコードには

import {ChartModule} from 'angular2-highcharts';
@NgModule({
....
imports:[
ChartModule.forRoot(require('highcharts'), require('highcharts/modules/drilldown'))})
]

しかし、私はこのエラーを受け取り続けます

エラーのエラーは、シンボル値を静的に解決する際に発生しました。関数「ChartModule」を呼び出しています。関数呼び出しはサポートされていません。関数またはラムダをエクスポートされた関数への参照に置き換えることを検討してください。

だから私は試しました

export function highchartsRequire:any {
   return{
     require('highcharts'), 
     require('highcharts/modules/drilldown')
   }
}
...
ChartModule.forRoot(highchartsRequire())

それでも動作しません。何か案は?

angular 2 angular cli:1.0.0-beta.30

PDATE-JayChaseのおかげで部分的に機能しました

これは機能します

export function highchartsFactory() {
      return require('highcharts');

    }

ただし、一度に2つは必要ありません

declare var require: any;
export function highchartsFactory() {
  return function () {
    require('highcharts');
    require('highcharts/modules/drilldown')
  };
}

@NgModule({
  imports: [
    ChartModule
  ],
  providers: [
    {
      provide: HighchartsStatic,
      useFactory: highchartsFactory
    }
  ],

何か案は?ありがとうございました。

10
Julian

これには未解決の問題と回避策があります ここ エクスポートされた関数を使用します。

    import { BrowserModule } from '@angular/platform-browser';
    import { NgModule } from '@angular/core';
    import { FormsModule } from '@angular/forms';
    import { HttpModule } from '@angular/http';
    import { ChartModule } from 'angular2-highcharts';
    import { HighchartsStatic } from 'angular2-highcharts/dist/HighchartsService';

    import { AppComponent } from './app.component';

    declare var require: any;

    export function highchartsFactory() {
      const hc = require('highcharts');
      const dd = require('highcharts/modules/drilldown');
      dd(hc);

      return hc;
    }

    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        ChartModule
      ],
      providers: [
        {
          provide: HighchartsStatic,
          useFactory: highchartsFactory
        }
      ],
      bootstrap: [AppComponent]
    })
    export class AppModule { }
25
JayChase