最近,用 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 中定义的,因此,我们需要指定类型。

以上

angular使用canvas操作时报错的更多相关文章

  1. svn执行clean up 操作时报错 "Previous operation has not finished; run 'cleanup' if it was interrupted"解决如下!

    今天在项目中更新的时候,突然间爆了一个svn的这个错误,当时提示我去clean up操作,结果我执行clean up操作时候,还是报错,后来坚持出来,是因为ios项目中的一个图标出了问题,使svn进入 ...

  2. 对ArrayList操作时报错java.util.ConcurrentModificationException null

    用iterator遍历集合时要注意的地方:不可以对iterator相关的地方做添加或删除操作.否则会报java.util.ConcurrentModificationException 例如如下代码: ...

  3. 高级复制实验配置添加复制节点操作时报错:ORA-23308: object GP.T does not exist or is invalid

    出错原因: 使用高级复制时,在源端启动复制支持,执行语句:REPADMIN@bys1>execute dbms_repcat.generate_replication_support('gp', ...

  4. MySQL执行插入操作时报错1366 - Incorrect string value

    今天在测试mysql时,发现插入数据的问题,下面和大家分享下解决方法: 首先看问题原因: [Err] 1366 - Incorrect string value: '\xCF\xD6' for col ...

  5. github执行clone操作时报错

    在执行github上的clone操作时,报 ssh_exchange_identification: Connection closed by remote host 在网上找了好多种解决办法,都没有 ...

  6. windows操作报错:无法启动此程序,因为计算机中丢失api-ms-win-core-winrt-string-l1-1-0.dll

    在Windows上做提交svn操作时报错:无法启动此程序,因为计算机中丢失api-ms-win-core-winrt-string-l1-1-0.dll,如下图: 解决办法: 在 https://cn ...

  7. 在用python操作mysql时报错:ModuleNotFoundError: No module named 'MySQLdb'

    用Flask+python+mysql写一个小项目 系统 win10 py版本:3.6.1 在配置数据库时报错ModuleNotFoundError: No module named 'MySQLdb ...

  8. 关于Quartus II 13.0对应开发NIOS II软件程序时报错Symbol 'NULL' could not be resolved问题的解决方法

    关于Quartus II 13.0对应开发NIOS II软件程序时报错Symbol 'NULL' could not be resolved问题的解决方法 近期在评估使用NIOS II处理器进行项目的 ...

  9. svn执行clean up命令时报错

    svn执行clean up命令时报错“Previous operation has not finished; run 'cleanup' if it was interrupted”.无论你到那个父 ...

随机推荐

  1. JAVA后端常用框架SSM,redis,dubbo等

    JAVA后端常用框架SSM,redis,dubbo等   一.SpringMVC http://blog.csdn.net/evankaka/article/details/45501811 spri ...

  2. leetcode 【 Subsets II 】python 实现

    题目: Given a collection of integers that might contain duplicates, S, return all possible subsets. No ...

  3. leetcode 【 Set Matrix Zeroes 】python 实现

    题目: Given a m x n matrix, if an element is 0, set its entire row and column to 0. Do it in place. cl ...

  4. IOS开发学习笔记037-九宫格代码实现

    九宫格布局,用手机输入法时经常见到.先按3行3列写. 代码的实现主要是计算插入图片的位置. 每一张图片的位置和所在的行列密切相关.分析过程如下: 界面: 代码实现 1.把需要的图片资源添加进来 然后给 ...

  5. ios开发学习笔记001-C语言基础知识

    先来学习一下C语言基础知识,总结如下: 在xcode下编写代码. 1.编写代码 2.编译:cc –c 文件名.c 编译成功会生成一个 .o的目标文件 3.链接:把目标文件.o和系统自带的库合并在一起, ...

  6. Spring整合hibernate -SessionFactory

    本文目录 1  本文采用 hibernate4 整合 Spring3.1 2 把Spring获取datasource通过class="org.springframework.orm.hibe ...

  7. 3种jQuery弹出大图效果

    本实例用到了jquery.imgbox.pack.js库.直接看代码: <!DOCTYPE html> <html lang="en"> <head& ...

  8. Kotlin-Not enough information to infer parameter T in fun<T:View> findViewById(id: Int): T!

    代码改变世界 错误: Type inference failed : Not enough information to infer parameter T in fun<T:View> ...

  9. Codeforces #990E Post Lamp

    题目大意 今欲用若干条长为 $k$($1\le k\le m, k\in \mathbb{Z}$) 的线段覆盖数轴上 $[0,n]$ 这一段.线段的起点(左端点)必须为 $[0, n-1]$ 中的某个 ...

  10. script error总结

    移动端的页面在控制台报出一个script error,通常的原因有一下几点: 1. 脚本引入错误 可能是脚本的地址不对,协议不对(http或https问题),本地host文件绑定的地址不对 2. 方法 ...