我在angular2上实现Jsplumb时遇到问题。

我正在尝试用组件在angular2中分层jsplumb,但是我收到一条错误消息说jsPlumb.ready不是函数

我通过npm导入了它,并将其放入webpack的vendor.js中

这是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代码。问题是我仍然无法拨打电话。

最佳答案

显然,导入它的正确方法是

import { jsPlumb } from 'jsplumb';

关于javascript - Jsplumb angular 2实现,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44117760/

10-16 21:20