Javascript 编写全局函数以在所有组件中使用

注意：它不是针对全局变量，而是针对全局通用函数，用于在所有组件上执行功能

我正在开发一个angular应用程序，其中我在不同的模块中有大约400个组件，几乎所有组件都有下面提到的同一种功能

许多页面上都有一个显示“如何工作部分”的部分，用户可以关闭该部分，除非他们再次打开它，否则该部分将保持关闭状态。我使用cookies完成了此操作，我在单击关闭或打开图标时设置了cookies，但此功能是在组件中编写的，需要在其他组件中导入

我想在某处创建一个函数，该函数在单击图标时执行此功能，并且可以在不导入任何其他组件的情况下调用

一种方法（如我所想）是在文件中创建一个JavaScript函数，并将其加载到索引文件中，然后在单击关闭和打开图标时调用该函数

---

不确定这是否是最好的方法。希望有人能想出更好的解决方案。

在我看来，这不是最好的解决方案。最好的解决方案是创建一个服务或一个utils类

但如果您想这样做，我建议您创建一个JS文件，在

scripts

属性下的angular-cli.json文件中声明，其中包含您的函数

编辑既然您已经回到了理性，下面是一个生成UTIL类的代码示例

export const IMG_UTILS = {
  convertPngToJpg = (picture: any) => {
    // Your logic here
  }
};

export const VIEW_MANAGER = {
  isAdblockActive = () => {
    // test if an ad-blocker is active
  }
};

您可以在const中创建任何您想要的utils类，然后将其放入文件中。然后，您可以将此文件放在utils文件夹中，并使用

import { VIEW_MANAGER } from 'src/app/utils/view-manager';

否则，您可以使用控制台命令（如

ng g s services/view-manager/view-manager

它将以完全相同的方式运行：您将在组件中导入它以使用它

---

希望这有帮助

您可以

导出
一个写在
.ts
文件中的函数，然后在所有组件中调用它

   export function myFunction(){
        // Do something
   }

然后在其他组件中导入函数
myFunction（）
。这对我来说很好，在某些情况下很有用。创建全局函数服务，即“服务”下的“funcs.services.ts”目录：

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})

export class FuncsService {
  constructor() { }
  
  myGlobalAddFunction(a){
    return a++;
  }
  mySecondFunc(){
    // add more... and so on
  }
}

2。在组件中导入函数：

// your path may different 
import { FuncsService } from './../services/funcs/funcs.service';
//...
constructor(
   private funcs: FuncsService
) {}
ngOnInit(): void {
   let x = 1;
   myResult = this.funcs.myGlobalAddFunction(x);
   // Then you are expecting 2 for return value
}

3。希望能奏效……：）
是的，我想到了这一点，但这将是一个javascript函数，我需要使用appOh中的一些变量值，不，一点也不！就在导入下面，您可以添加
declare var myFunction:any，现在您可以使用您的函数了。这实际上就是在typescript中使用JS框架的方式，比如jquery！我在模板上有此条件
*ngIf=“！storeOptionVideoStatus”
如何在cli文件中包含的文件中声明此条件，以及如何在模板中使用此条件？在您的文件中，您执行
窗口['storeOptionVideoStatus']=true
（或false，或任何您想要的），然后在您的组件中创建一个getter，如so
get-storeOptionVideoStatus（）{return window['storeOptionVideoStatus']；}
谢谢，解决方案是一种可执行的解决方案，但是否有任何文章可以让我了解这种方法和方法，作为一个新手，如果我能正确地完成它，我就不会这样做。