2017-05-22 24 views
0

我有一個在angular2上實現Jsplumb的問題。Jsplumb angular2 implmenetation

我試圖在angular2與組件層jsplumb但我得到一個錯誤說jsPlumb.ready不是一個函數

我進口它throught NPM並把它放在我的vendor.js爲的WebPack

這裏是component.ts

import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; 
var $ = require('jquery'); 
var jsPlumb = require('jsplumb'); 
@Component({ 
    selector: 'jsplumb-plot', 
    template: require('./jsplumb.plot.component.html'), 
    providers: [] 
}) 
export class JsplumbPlotComponent implements OnInit { 

    constructor() { 

    } 

    ngOnInit() { 
     jsPlumb.ready(function() { 
      console.log("this"); 
     }); 
    } 
} 

這裏是進口的WebPack

module.exports = { 
    resolve: { 
     extensions: [ '', '.js' ] 
    }, 
    module: { 
     loaders: [ 
      { test: /\.(png|woff|woff2|eot|ttf|svg|gif)(\?|$)/, loader: 'url-loader?limit=100000' }, 
      { test: /\.css(\?|$)/, loader: extractCSS.extract(['css']) } 
     ] 
    }, 
    entry: { 
     vendor: [ 
      .... 
      'jsplumb/dist/css/jsplumbtoolkit-defaults.css', 
      'jsplumb/dist/js/jsplumb.min.js' 
     ] 
    }, 

請注意,在webpack編譯後,我在vendor.js中看到了jsplumb的javascript代碼。問題是,我仍然無法從中撥打電話。

回答

0

顯然導入這是正確的方式,

import { jsPlumb } from 'jsplumb';