Javascript 将第三方JS文件加载到角度组件文件

我已经像这样将第三方js文件加载到app.component中

declare var MarvinJS: any;
import { MarvinJS } from "../assets/js/marvinjslauncher.js";

我可以在我的应用程序组件类中使用marvinjslauncher.js中定义的方法吗？如果可以，请指导我如何使用？我尝试过这样使用：

export class AppComponent {
  constructor() {
      MarvinJS.MarvinJSUtil.getEditor("#sketch").then(function(sketcherInstance){
            });
}

如果我的进口方式是错误的，请你也指导我。我还将marvinjslauncher.js文件包含在index.itml中 我遇到了这样的错误：

ERROR TypeError: Cannot read property 'MarvinJSUtil' of undefined
    at new AppComponent (eval at <anonymous> (bundle.js:1312), <anonymous>:16:39)
    at createClass (eval at <anonymous> (bundle.js:321), <anonymous>:11007:26)
    at createDirectiveInstance (eval at <anonymous> (bundle.js:321), <anonymous>:10841:37)
    at createViewNodes (eval at <anonymous> (bundle.js:321), <anonymous>:12204:49)
    at createRootView (eval at <anonymous> (bundle.js:321), <anonymous>:12109:5)
    at callWithDebugContext (eval at <anonymous> (bundle.js:321), <anonymous>:13247:42)
    at Object.debugCreateRootView [as createRootView] (eval at <anonymous> (bundle.js:321), <anonymous>:12707:12)
    at ComponentFactory_.create (eval at <anonymous> (bundle.js:321), <anonymous>:10030:46)
    at ComponentFactoryBoundToModule.create (eval at <anonymous> (bundle.js:321), <anonymous>:3633:29)
    at ApplicationRef_.bootstrap (eval at <anonymous> (bundle.js:321), <anonymous>:5214:57)

错误类型错误：无法读取未定义的属性“MarvinJSUtil”
在新的AppComponent（eval at（bundle.js:1312），：16:39）
在createClass（eval at（bundle.js:321），：11007:26）
在createDirectiveInstance（eval at（bundle.js:321），：10841:37）
在createViewNodes（eval at（bundle.js:321），：12204:49）
在createRootView（eval at（bundle.js:321），：12109:5）
在callWithDebugContext（eval at（bundle.js:321），：13247:42）
在Object.debugCreateRootView[作为createRootView]（eval at（bundle.js:321），：12707:12）
在组件工厂创建（eval at（bundle.js:321），：10030:46）
在ComponentFactoryBoundToModule.create（eval at（bundle.js:321），：3633:29）
at应用程序参考引导（eval at（bundle.js:321），：5214:57）

根据我们在评论中的讨论，这里有一些事情可以解决此问题和代码中的其他问题：

首先，将您的

MarvinJs

js文件包含为

，并确保您可以在控制台中访问

MarvinJs

命名空间和utils

然后，在app.component.ts文件中

declare var MarvinJS: any; // keep
// remove this import
//import { MarvinJS } from "../assets/js/marvinjslauncher.js";

export class AppComponent implements AfterViewInit { // implement AfterViewInit

  constructor() {} // remove MarvinJs code from constructor

  ngAfterViewInit(){
       // move MarvinJs code from constructor to ngAfterViewInit method. read about AfterViewInit here: https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html
       MarvinJS.MarvinJSUtil
      .getEditor("#sketch")
      .then(function(sketcherInstance){});
  }

---

偶然使用角cli？如果MarvinJS不是ES模块，导入将不起作用。你；我必须通过

标签将其添加到您的页面。然后您不需要import语句，浏览器中将提供

MarvinJS

命名空间。请尝试在构造函数中实例化MarvinJS，不要声明var.constructor（private MarvinJS:MarvinJS）{}然后尝试引用this.marvinJS，看看是否可以通过它获得方法instance@AhmedMusallam这不是真的，您可以使用

import'dep'加载全局依赖项

yes

import./assets/js/marvinjslauncher.js“

是静态导入。而

从“./assets/js/marvinjslauncher.js”导入{MarvinJS}”是一个模块导入。我确实说过，问题中的导入将不起作用：）不建议使用静态导入，因为似乎全球都需要
MarvinJS
。静态导入一词从何而来？