在Angular中启用Trusted Types遇TS类型错误，如何解决？

这个错误是因为TypeScript的全局类型定义默认未包含Trusted Types的API声明，编译器无法识别window.trustedTypes属性。以下是几种可行的解决方法：

方法1：安装官方类型声明包 #

直接安装Trusted Types的类型定义包，让TypeScript自动识别该API：

npm install @types/trusted-types --save-dev

安装完成后，无需修改现有代码，TypeScript就能正确识别window.trustedTypes的类型。

方法2：手动扩展Window接口 #

若不想安装额外依赖，可在项目中创建类型声明文件（比如src/typings.d.ts），扩展Window接口：

interface Window {
  trustedTypes?: TrustedTypePolicyFactory;
}

用?标记为可选属性，既让TypeScript认可该属性存在，也符合浏览器兼容性的实际情况。

方法3：类型断言快速绕过检查 #

针对临时调试或简单场景，可直接用类型断言跳过类型检查：

let sanitizer = (window as any).trustedTypes?.createPolicy('my-policy', {
  // 配置你的策略方法，如createHTML、createScript等
  createHTML: (input: string) => input
});

必加步骤：浏览器兼容性检查 #

无论采用哪种方法，都要在运行时先判断浏览器是否支持Trusted Types，避免运行时错误：

if (window.trustedTypes) {
  const sanitizer = window.trustedTypes.createPolicy('my-policy', {
    createHTML: (input) => {
      // 实现你的安全过滤逻辑
      return input;
    }
  });
}

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