首页 > 解决方案 > 无法从 Angular 7 组件中的外部 jQuery 文件访问方法

问题描述

我正在尝试从 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'});
      }
}

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

标签: javascriptjqueryangular6angular7angular-components

解决方案


我通过声明 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));

推荐阅读