StrictNullChecks和getElementById

Question

在TypeScript 2.0中启用了StrictNullChecks，代码

var el: HTMLElement = document.getElementById('element_id');

产生错误

Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
Type 'null' is not assignable to type 'HTMLElement'.

为什么会这样，如何在不使el为空的情况下编译代码？

Answer 1

你可以写：

var el = document.getElementById('element_id')!;

！意思是“相信我，这不是一个空引用”

Answer 2

这是因为如果找到该元素，document.getElementById(...);可以返回HTMLElement的实例，如果不是，则null可以返回var el: HTMLElement | null = document.getElementById("..."); 。由于此API不在您的控制之下，您必须修改代码以允许元素可以为空：

type NullableHTMLElement = HTMLElement | null;
var el: NullableHTMLElement = document.getElementById("...");

您还可以创建自己的可空类型别名：

@SpringBootApplication(exclude = {demo.class})

或者更好的是你可以使用AlexG提供的解决方案，甚至更好！

Answer 3

我知道已经很晚了，希望对您有所帮助。对于我的情况，我想替换一个输入值...因此，以上答案引发了另一个错误，例如“类型'HTMLElement'上不存在属性'值'”。所以我尝试如下所示，它对我有用。

const el = document.getElementById("my_el_id") as any;
if(el){ //Even this condition not required
  el.value = "New value";
}