分配变量类型

时间:2016-05-29 17:41:35

标签: typescript angular webstorm

我担心我不确定这是关于 WebStorm Angular2 还是 Typescript 的问题。

我有一个Angular2构建设置,并且正在使用WebStorm 2016.1.2进行编辑。我的一个组件使用简单的document.getElementById('some-el');获取对DOM元素的引用,并将其传递给服务方法:

calc(el:HTMLElement){
    this.height = el.offsetHeight;
    this.width = el.offsetWidth;

    let span:HTMLElement = el.querySelector("span");
    this.pos = span.offsetTop - span.offsetHeight;
}

一切正常,我在浏览器中没有出现任何错误,但我在WebStorm中遇到错误链接到el.querySelector("span");

错误说明: Initializer type Element is not assignable to variable type HTMLElement

我不知道WebStorm是否存在此问题,或者我实际输错了。如果我将span的类型设置为Element,则错误消失,但offsetTopoffsetHeight突出显示为不正确?

由于实际构建在运行时似乎没有受到影响,我只是想知道这是否是我的代码中需要修复的内容或者我的编辑器中我可以忽略的内容?

为你的帮助干杯

1 个答案:

答案 0 :(得分:2)

你只需要施展它:

alter sequence basedesign_id_seq restart with 2;

或者您可以使用type assertion

calc(el:HTMLElement){
    this.height = el.offsetHeight;
    this.width = el.offsetWidth;

    let span:HTMLElement = <HTMLElement> el.querySelector("span");
    this.pos = span.offsetTop - span.offsetHeight;
}

当您宣布let span:HTMLElement = el.querySelector("span") as HTMLElement; 的类型时,querySelector会返回Element而非HTMLElement会发生什么。但你可以告诉编译器“相信你”,你知道它确实是span

您也可以使用HTMLElement代替更具体的HTMLSpanElement,就像HTMLElementHTMLElement更具体(这就是为什么当您将其更改为{时{1}} ElementElement无效。