如何在 JavaScript 文件中调用 Angular 组件中定义的函数？

Question

在 .ts 文件中，我有以下代码

export class SomeClass {
    .
    .
    .
    public someMethod() {
        ...
    }
}

我想在 .js 文件中调用此 someMethod 方法。

我试过了

import { SomeClass } from '../../../../SomeClass';
.
.
.
SomeClass.someMethod();

但出现以下错误：

someMethod is not a function

我必须制作方法 static 吗？

我不喜欢，因为它会调用其他方法，我将不得不制作所有这些方法 static。

我可以在 .js 文件中创建这个 class 的实例吗？

谢谢！

Answer 1

可能的方式

您可以使用构建命令构建您的 ts 文件并将其转换为 javascript 然后在您的 js 文件中调用它

这应该有效

Answer 2

有两种解决方法要么先创建 class 的实例，然后使用 public 方法，如

let class = new SomeClass();
class.someMethod();

或者将它设为静态方法，这样你的代码就能编译成功

Answer 3

再创建一个class的实例，你也可以使用一些像

export function MyClass() {
    return new SomeClass()
}

或者如果你需要一个构造器

export function MyClass(args) {
    return new SomeClass(args)
}
class SomeClass{
   constructor(arg){this._arg=arg}
}

你可以在.ts

import { MyClass} from '...';

@Component({
   ...
})
export class AppComponent {
  MyClass=MyClass //<--if you want to use in .html
  ....
  myfunction(){
     MyClass.someMethod();
     //or
     const obj=MyClass();
     obj.someMethod();
  }
}

你也可以，如果只有定义的函数使用 const

export const Utils{
    someFunction:()=>{console.log("hello"}
}

然后你只需使用 Utils.someFunction()

如何在 JavaScript 文件中调用 Angular 组件中定义的函数？

How can I call a function defined in an Angular component in a JavaScript file?

javascript

frontend

angular