Angular 2-AOT-调用函数“ ChartModule”，不支持函数调用 [英] Angular 2 - AOT - Calling function 'ChartModule', function calls not supported

问题描述

我为此失去了理智和毛发。我正在Angular 2中导入HighCharts，但需要一些额外的库。到目前为止，我的代码中

I am losing my mind and hair over this. I am importing HighCharts in Angular 2 but need to require some of its extra libraries. So far in my code I have

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

但我一直收到此错误

错误遇到错误，静态地解析符号值。调用函数 ChartModule。不支持函数调用。考虑使用对导出的函数的引用替换函数或lambda。

ERROR in Error encountered resolving symbol values statically. Calling function 'ChartModule'. function calls are not supported. Consider replacing the function or lambda with a reference to an exported fucntion.

所以我尝试了

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

仍然无效。有想法吗？

使用角度2
角度cli：1.0.0-beta.30

Using angular 2 angular cli: 1.0.0-beta.30

更新-多亏了JayChase，部分工作了

这可行

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

    }

但我不能一次要求两个

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

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

有任何想法吗？谢谢。

推荐答案

对此存在一个问题和解决方法此处使用导出的函数。

There is an issue open for this and a workaround here using an exported function.

    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 { }

这篇关于Angular 2-AOT-调用函数“ ChartModule”，不支持函数调用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！