最近,用 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. 36、imageview的坑

    当频繁设置imageview的背景图片时,用: imageviewChooseStaff.setImageResource(R.drawable.default_head_pic); 而不是 imag ...

  2. 【Palindrome Partitioning】cpp

    题目: Given a string s, partition s such that every substring of the partition is a palindrome. Return ...

  3. 如何使用 JSX 构建 Gutenberg 块

    本教程将介绍使用 JSX 构建自定义块所需的步骤. 由于浏览器不支持 JSX 和 ES6,因此我们需要将代码编译后才能在浏览器中运行. 我们不需要手动编译代码,因为有些工具可以为我们自动执行此过程. ...

  4. hnust 土豪金的加密解密

    问题 G: 土豪金的加密与解密 时间限制: 1 Sec  内存限制: 128 MB提交: 466  解决: 263[提交][状态][讨论版] 题目描述     有一位姓金的同学因为买了一部土豪金,从此 ...

  5. mvc-自定义视图引擎

    //自定义视图引擎的实质是把数据模型(moudle)和模板(View)转换成html页面,输出到客户端public class MyView:IView { string _viewPath; pub ...

  6. python 使用入的坑

    如测试代码,并没有将li.li_ 的交集查询出来 li=[1,2,3,4,5] li_=[2,5,6,7,9] for i in li_: if i in li: li_.remove(i) prin ...

  7. BZOJ 1096: [ZJOI2007]仓库建设(DP+斜率优化)

    [ZJOI2007]仓库建设 Description L公司有N个工厂,由高到底分布在一座山上.如图所示,工厂1在山顶,工厂N在山脚.由于这座山处于高原内陆地区(干燥少雨),L公司一般把产品直接堆放在 ...

  8. tmux使用备忘

    创建新的session tmux 查看已有session tmux ls 进入tmux后 默认快捷键前缀为Ctrl+b,可以通过配置文件来修改 从session中断开 C-b d 给session改名 ...

  9. shell的简单介绍

    一 什么叫shell,shell 是什么 如果考虑到操作系统其实是一组软件,我们可以发现应用程序其实是在最外层,就如同鸡蛋的外壳一样,因此这个也就被称为shell. 其实shell的功能只是提供用户操 ...

  10. Long.ValueOf("String") Long.parseLong("String") 区别 看JAVA包装类的封箱与拆箱

    IP地址类型转换原理: 将一个点分十进制IP地址字符串转换成32位数字表示的IP地址(网络字节顺序). 将一个32位数字表示的IP地址转换成点分十进制IP地址字符串. 1.Long.ParseLong ...