无法从Angular 6中的Typescript调用javascript函数

Question

是否未从ngOnInit（）调用下面的javascript函数（帮助）？

在Web控制台中：错误ReferenceError：“未定义帮助”

您知道如何做到吗？

---

src / assets / myjs.js：

function help() {
    console.log("hilfe");   
}

---

src / app / highlight.directive.ts：

import { Directive, ElementRef, OnInit } from '@angular/core';

declare function help() : any;

@Directive({
  selector: '[appHighlight]'
})
export class HighlightDirective implements OnInit {

  constructor(el: ElementRef) { 
    el.nativeElement.style.backgroundColor = 'yellow';
  }

  ngOnInit() {
    help();
  }

}

---

angular.json：

...

    "styles": [
         "src/styles.css"
    ],
    "scripts": [
        "src/assets/myjs.js"
    ],
},
...

Answer 1

导出类似的函数

module.exports.help = () => {
      console.log("hilfe");   
}

然后

const helper = require("./pathofyourfile");

Answer 2

@ simon-reeves

  

“脚本”：[           “ src / assets / myjs.js”       ]

我不得不将testjs.js文件放到assets文件夹中，并按如下所示应用路径

此外，请确保在上方定义了assets部分，并且源中的该路径下存在该文件

此外，检查生成的scripts.js文件cuz的内容，它应该包含您的help函数，例如就我而言，它是myalert函数

希望它会对您有所帮助

Answer 3

angular.json文件中有两个脚本部分。一个是“建筑师：”，另一个是“测试：”。您的脚本定义在两个地方都有吗？

    "scripts": [ "src/assets/myjs.js" ],

我怀疑第二点是否会有所作为，但我受一则帖子的指导，在资产“ js”下创建了一个子目录。像这样...

    "scripts": [ "src/assets/js/myjs.js" ],

您也可以在js函数中尝试使用alert（'hilfe'），而不是console.log（）...，尽管两者都应该起作用。

否则，您的设置似乎非常正确。

此外，您需要在组件文件中声明相同的功能。例如，函数名称为JavaScript文件为help（），则需要在组件上方声明它，例如：     声明函数help（）：any; 然后在该文件中要调用的位置调用帮助功能。

Answer 4

ES6 / TS

只需在help.ts中导出功能帮助

export default function Help(){}

通过...导入任何地方

import Help from 'help'