Angular 属性“offsetWidth”在“元素”类型上不存在

Question

angular 的新手，我正在尝试使用 ScrollTrigger 进行水平滚动。

它可以工作，但是当我服务或构建时出现错误：“元素”类型上不存在属性“offsetWidth”。

这是 gsap 的代码：

gsap.to(sections, {
  xPercent: -100 * (sections.length - 1),
  ease: "none",
  scrollTrigger: {
    trigger: ".panel-container",
    pin: true,
    scrub: 1,
    snap: 1 / (sections.length - 1),
    end: () => "+=" + document.querySelector(".panel-container").offsetWidth
  }
});

即使我得到它的错误，当我控制台记录“document.query ..”时，我得到了元素的良好宽度。

但是该错误阻止我构建。 我已经做了演员表的事情，首先是：

let myElem = document.querySelector(".panel-container").offsetWidth as HTMLElement;

或者之前，但这不起作用，我有带有红色下划线的错误消息：将类型“字符串”转换为类型“HTMLElement”可能是一个错误，因为这两种类型都没有与另一种充分重叠。

我的 angular 项目是 10.0.5。

在回复中尝试了解决方案：

(document.querySelector(".panel-container") as HTMLElement).offsetWidth;

但是在红色下划线出现此错误，但在我发球时控制台中没有任何内容。

将“Element”类型转换为“HTMLElement”类型可能是一个错误，因为这两种类型都没有与另一种充分重叠。 如果这是故意的，请先将表达式转换为“未知”。 “元素”类型缺少“HTMLElement”类型的以下属性：accessKey、accessKeyLabel、autocapitalize、dir 和 105 more.ts(2352)

Answer 1

尝试从querySelector输入预期的 output 。

那是：

document.querySelector<HTMLElement>(".panel-container").offsetWidth

Answer 2

结果可能是 null，因此如果您启用了 strictNullChecks，您需要先执行 null 检查：

if (element.== null) {... }