angular - 无法使用按钮 Angular 显示/隐藏 Canvas

标签 angular typescript angular5

在我的项目中,我有一个 Canvas <div>我可以用鼠标写/画的地方。 它工作正常,所以我添加了一个简单的按钮来显示和隐藏这个 div每次你点击它,但当我这样做时,它没有捕捉到鼠标事件,我不能画/写, Canvas 尺寸不等于我在属性中设置的尺寸。

我一整天都尝试了很多事情,但我无法弄清楚。

这是我添加到 HTML 中的内容:

<button type="button" (click)="Draw()" id="bt">{{des}}</button>
<div *ngIf="show">
  <div class="canvas">
    <canvas #canvas id="canvas"></canvas>
  </div>
  <input type="button" value="Erase" (click)="Erase()"/>
</div>    

我所做的只是用 div 围绕我的 Canvas .

最佳答案

您仍然可以使用具有反向逻辑的 [hidden]:

<div [hidden]="!show">
  ...
</div>   

关于angular - 无法使用按钮 Angular 显示/隐藏 Canvas ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50335346/

相关文章:

javascript - Angular 4 - 设置网站上的url以显示index.html

javascript - Typescript:抽象泛型类的子类类型

angular-cli - Angular 5 背景图片不会显示

javascript - Angular 2+ 从另一个组件获取 "form.valid"的最佳方法

mysql - AES_DECRYPT 从 typescript 中的 blob 获取值

javascript - ionic 2 : Cannot read the property 'open' of undefined

javascript - 立即访问 Angular 4 查询参数?

Angular 路由到同一组件的多条路径

node.js - Typescript 和 Node.js 中的 HTTP 服务器错误处理程序

javascript - 使用 script.js 从 Typescript 加载模块