Angular：属性“xxx”在类型“Window & typeof globalThis”上不存在

Question

在为我的应用程序提供服务后，我在命令行中收到了我添加的 Trustbox 组件 ts 文件的问题。

    "Property 'Trustpilot' does not exist on type 'Window & typeof globalThis'."

我试图声明窗口并四处寻找解决方案，但对于我的生活无法弄清楚。

这是 trustbox.component.ts 代码

import { Component, OnInit } from '@angular/core';
@Component({
  selector: 'app-trustbox',
  templateUrl: './trustbox.component.html',
})
export class TrustboxComponent implements OnInit {
  constructor() {}
  ngOnInit() {
    const trustboxRef = document.getElementById('trustbox');
    window.Trustpilot.loadFromElement(trustboxRef);
  }
}

根据 Trustpilot 文章（ https://support.trustpilot.com/hc/en-us/articles/115011421468--Add-a-TrustBox-widget-to-a-single-page-application ）让他们的小部件工作您必须的SPA

1. 实现 OnInit。
2. 获取对我们之前粘贴的元素的引用。
3. 调用 loadFromElement 函数。

我知道这可能非常简单，但它非常烦人，因为我无法编译我的应用程序。 很感谢任何形式的帮助。 提前致谢！

Answer 1

使用@ViewChild获取引用并对其进行处理，并使用 AfterViewInit 仅在阅读器完成并在屏幕上创建组件后使用。

例子：

import { Component, ViewChild, AfterViewInit, ElementRef } from "@angular/core";

@Component({
  selector: "my-app",
  template: `
    <p #pRef>
      Start editing to see some magic happen :)
    </p>
  `,
  styleUrls: ["./app.component.css"]
})
export class AppComponent implements AfterViewInit {
  name = "Angular";

  @ViewChild("pRef", { static: false }) pRef: ElementRef;

  ngAfterViewInit() {
    console.log(this.pRef.nativeElement.innerHTML);
    this.pRef.nativeElement.innerHTML = "DOM updated succesfully!!!";
  }
}