如何在Angular项目中使用带命名空间的外部JavaScript库

你只需要在TypeScript中声明对应的命名空间类型，就可以正常调用封装在命名空间里的函数了，具体步骤如下：

1. 在app.component.ts顶部添加命名空间的类型声明

// 声明全局命名空间的类型，告诉TypeScript这个命名空间的结构
declare namespace testNamespace {
  function insideFunction(str: string): void;
}

2. 在组件类中通过命名空间调用目标函数

export class AppComponent {
  public test(str: string): void {
    // 直接通过命名空间访问内部函数
    testNamespace.insideFunction(str);
  }
}

补充说明 #

• 这个声明的作用是让TypeScript识别全局存在的testNamespace命名空间，避免编译报错，同时提供基本的类型检查（比如参数类型提示）。
• 确保你的JavaScript库已经正确全局加载到项目中（比如在angular.json的scripts数组里配置了库的路径，或者通过script标签直接引入）。

内容的提问来源于stack exchange，提问作者snowysparrow