angular2-highchartsハイチャートエクスポートモジュール

Question

エクスポートモジュールをangular2アプリケーションに含めるにはどうすればよいですか？

私は以下のスクリプトをindex.htmlに追加しようとしましたが、何も起こりません。

<script src="http://code.highcharts.com/modules/exporting.js"></script> 

Answer 1

ここで例えば、HighchartsExporting、ディレクティブを作成Highchartsするためのものである：アンギュラCLI 1.0-RC.1と最新angular2-highchartsのよう

import {Directive, ElementRef, Input, OnDestroy} from '@angular/core'; 

@Directive({ 
    selector: '[ng2-highcharts]', 
    exportAs: 'ng2Highcharts' 
}) 
export class Ng2Highcharts implements OnDestroy { 
    hostElement: ElementRef; 
    pChart: HighchartsChartObject; 
    constructor(ele: ElementRef) { 
     this.hostElement = ele; 
    } 

    @Input('ng2-highcharts') set options(opt: HighchartsOptions) { 
     if (!opt) { 
      console.log('No valid options...'); 
      console.log(opt); 
      return; 
     } 
     if (opt.series || opt.data) { 
      if (this.pChart) { 
       this.pChart.destroy(); 
      } 
      if (!opt.chart) { 
       opt.chart = {}; 
      } 
      opt.chart.renderTo = this.hostElement.nativeElement; 
      this.pChart = new Highcharts.Chart(opt); 
     } else { 
      console.log('No valid options...'); 
      console.dir(opt); 
     } 
    } 


    public get chart() : HighchartsChartObject { 
     return this.pChart; 
    } 

    ngOnDestroy() { 
     if (this.pChart) { 
      this.pChart.destroy(); 
     } 
    } 
} 

Answer 2

、これは私のために働いている（参照また、これは、進行推奨される解決策のための議論をhttps://github.com/gevgeny/angular2-highcharts/issues/156）：typings.d.tsで

npm install --save angular2-highcharts 
npm install --save @types/highcharts 

追加：declare var require: any;

app.module.tsでその後

：以前のバージョンのための

import { ChartModule } from 'angular2-highcharts'; 
import {HighchartsStatic} from 'angular2-highcharts/dist/HighchartsService'; 
export function highchartsFactory() { 
    var hc = require('highcharts'); 
    var hcm = require('highcharts/highcharts-more'); 
    var exp = require('highcharts/modules/exporting'); 

    hcm(hc); 
    exp(hc); 
    return hc; 
} 

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

旧答え：

あなたは、角度-CLI（WebPACKの）を使用し、angular2-highcharts場合は、これは私の仕事：

import {Highcharts} from 'angular2-highcharts'; 
require('highcharts/modules/exporting')(Highcharts);