angular中用js语言的问题

今天分享一下最近遇到的一个问题

用 angular 前端框架为应用登录新增图形验证码认证，由于没有现成的插件，于是便使用canvas+js操作，也是可以正常使用，但是在编译阶段却有个报错：

ERROR in src/app/login/login.component.ts(84,19): error TS2339:
Property 'getContext' does not exist on type 'HTMLElement'.

虽然报错，但是确实可以正常执行，很是奇怪。报错的代码为：

let c = document.getElementById("myCanvas") ;
let ctx = c.getContext("2d");

查看源码是有 getContext() 这个方法的。后面想是不是类型导致的呢，于是，使用类型断言（不影响代码运行，只是在编译阶段起作用）修改代码入下：

let c = document.getElementById("myCanvas")  as HTMLCanvasElement;
let ctx = c.getContext("2d");

编译正常通过。后面了解，还有另外一种断言方式：

let c = <HTMLCanvasElement> document.getElementById("myCanvas") ;
let ctx = c.getContext("2d");

以上均可编译通过，因为 getContext() 是在 HTMLCanvasElement 中定义的，因此，我们需要指定类型。