无法从 Angular 7 组件中的外部 jQuery 文件访问方法答案

【问题标题】：Unable to access a method from exteral jQuery file in angular 7 component无法从 Angular 7 组件中的外部 jQuery 文件访问方法
【发布时间】：2019-10-08 02:15:39
【问题描述】：

我正在尝试从 Angular 7 组件中的外部 js(jQuery) 文件访问方法，我尝试了很多方法，但无法在外部文件中调用该方法。以下是我的代码：

external file: 

> (function ($) {
    var makeLink = function (infos) {
        if (oneToMany == "off") {
            // If the link already exists then we erase it
            eraseLinkA(infos.offsetA);
            eraseLinkB(infos.offsetB);
        }

        linksByOrder.push({ "from": infos.offsetA, "to": infos.offsetB });
        linksByName.push({ "from": infos.nameA, "to": infos.nameB });
        draw();

        $("body").trigger({
            type: "fieldLinkerUpdate",
            what: "addLink"
        });
    }
}(jQuery));



 ts file:

    import * as abcJS from '../external.js';
    import * as $ from 'jquery';
    declare var makeLink: any;
    declare var jQuery: any;
export class FieldMappingComponent implements OnInit, AfterViewInit {
constructor(public templateService: TemplateService, private route: ActivatedRoute) { }

  ngOnInit() {
    this.route.paramMap.subscribe(params => {
      this.templateId = params.get('id');
    });

    ngAfterViewInit() {
    makeLink({offsetA: 0, nameA: 'Date', offsetB: 1, nameB: 'settlement-end-date'});
      }
}

我没有找到错误的地方。任何建议都可能有所帮助。提前致谢。

【问题讨论】：

您将所有内容导入为abcJS，因此您需要在某处使用该名称。但这并不重要，因为该函数包装在 IIFE 中，因此在该函数之外不可见。你必须改变函数。
感谢您的回复。 “你必须改变功能” - 你能提供任何例子来做到这一点
您需要转换为使用模块。参见，例如，Call IIFE From Another Javascript File。
我通过声明 var makeLink; 实现了对 make 链接方法的访问；全局覆盖在 IIFE 中的函数
随意 - 实际上鼓励 - 发布您的解决方案作为答案。它可以帮助处于类似情况的其他人。

标签： javascript jquery angular6 angular7 angular-components

【解决方案1】：

我已经通过声明 var makeLink; 实现了对 make 链接方法的访问；全局覆盖在 IIFE 中的函数之上

外部文件：

 var makeLink;
(function ($) {
 makeLink = function (infos) {
        if (oneToMany == "off") {
            // If the link already exists then we erase it
            eraseLinkA(infos.offsetA);
            eraseLinkB(infos.offsetB);
        }

        linksByOrder.push({ "from": infos.offsetA, "to": infos.offsetB });
        linksByName.push({ "from": infos.nameA, "to": infos.nameB });
        draw();

        $("body").trigger({
            type: "fieldLinkerUpdate",
            what: "addLink"
        });
    }
}(jQuery));

【讨论】：