执行事件获取数据

<div class="shijian">
  <p>ng 事件</p>
  <p><button (click)="run();">执行事件</button></p>
  <p></p>
  <p>执行事件获取数据</p>
  <p><button (click)="getData();">执行事件获取数据</button></p>
  <p>{{title}}</p>
  <p></p>
</div>

监听键盘事件
HTML 中:
  <div class="shijian">
    <p>ng 事件</p>
    <p><button (click)="run();">执行事件</button></p>
    <p></p>
    <p>执行事件获取数据</p>
    <p><button (click)="getData();">执行事件获取数据</button></p>
    <p>{{title}}</p>
    <p></p>
  </div>
  <div class="key">
    <p>监听键盘的点击事件</p>
    <p></p>
    <p>当鼠标按下回车键的时候给出提示</p>
    <input type="text" (keydown)="keyDown($event)">
    <p></p>
    <input type="text" (keyup)="keyUp($event)">
    <p></p>
  </div>
 
  

  <p>执行方法获取事件对象</p>
  <p><button (click)="runEvent($event)">执行方法获取事件对象</button></p>
  <p></p>
ts中:
  

  keyDown(e){
   // console.log(e.keyCode);
   // keyCode 获取键盘的值;
   if(e.keyCode==13){
    alert("你按下了Enter键");
    console.log(e.target.value+" 你是使用target.value获取的");
   }else{
    alert("你按错了");
   }
  }
  keyUp(e){
    if(e.keyCode==49){
      alert("你按下了!键");
    }else{
      alert("错了");
    }
  }
 
  

  runEvent(e){
    var dom:any=e.target;
    dom.style.color="red";
  }

<p>e.target.value是获取输入框中的值</p>
<p>e.keyCode是获取按下键盘的值</p>
 
keydown和keyup的区别在于反应的快慢
 

ng 点击事件的更多相关文章

  1. Unity 4.6 uGUI的点击事件

    因为Unity 4.6刚刚发布,自带的uGUI功能的相关资料还不是很完善,今天刚装的Unity 4.6,想看一下uGUI是否好用,那么开始就今天的学习吧啊! 1,新建一个空的工程.

  2. 微信小程序tips集合:无法输入文字/随时查看页面/元素审查/点击事件/数据绑定

    1:编辑文档无法输入文字 出现这种情况一般是因为之前编辑的文档未保存,所有在其他文档输入的时候会自动输入到未保存的文档中,在文档暂时编辑完毕后要ctrl+s随手保存,不然会出现无法打字情况 2: 随时 ...

  3. Android控件——监听按钮的点击事件

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAroAAAFTCAIAAABZPDiZAAAgAElEQVR4nOy9918UWfb///1jdu2uBs

  4. Jquery的点击事件,三句代码完成全选事件

    先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  5. Android笔记——Button点击事件几种写法

    Button点击事件:大概可以分为以下几种: 匿名内部类 定义内部类,实现OnClickListener接口 定义的构造方法 用Activity实现OnClickListener接口 指定Button ...

  6. 关于Android避免按钮重复点击事件

    最近测试人员测试我们的APP的时候,喜欢快速点击某个按钮,出现一个页面出现多次,测试人员能不能禁止这样.我自己点击了几下,确实存在这个问题,也感觉用户体验不太好.于是乎后来我搜了下加一个方法放在我们U ...

  7. js 基础篇(点击事件轮播图的实现)

    轮播图在以后的应用中还是比较常见的,不需要多少行代码就能实现.但是在只掌握了js基础知识的情况下,怎么来用较少的而且逻辑又简单的方法来实现呢?下面来分析下几种不同的做法: 1.利用位移的方法来实现 首 ...

  8. Android中点击事件的实现方式

    在之前博文中多次使用了点击事件的处理实现,有朋友就问了,发现了很多按钮的点击实现,但有很多博文中使用的实现方式有都不一样,到底是怎么回事.今天我们就汇总一下点击事件的实现方式. 点击事件的实现大致分为 ...

  9. click事件的累加绑定,绑定一次点击事件,执行多次

    最近做项目为一个添加按钮绑定点击事件,很简单的一个事情,于是我按照通常做法找到元素,使用jquery的on()方法为元素绑定了点击事件,点击同时发送请求.完成后看效果,第一次点击没有问题.再一次点击后 ...

随机推荐

  1. C语言打印图形

    //输出图形 * * * * * * * * * * * * * * * * * * * * * * * * * //每行5个* void test1(){ //    外层负责行,外层执行一次,内层 ...

  2. 五月月赛 寻宝 exkmp + 主席树

    : 寻宝 时间限制: Sec 内存限制: MB 提交: 解决: [提交] [状态] [讨论版] [命题人:admin] 题目描述 采蘑菇的小西佬找到了一张上古年间的藏宝图,上面画着m座连绵不断的山,他 ...

  3. 51nod 1376 最长递增子序列的数量(不是dp哦,线段树 +  思维)

    题目链接:https://www.51nod.com/onlineJudge/questionCode.html#!problemId=1376 题解:显然这题暴力的方法很容易想到就是以每个数为结尾最 ...

  4. CodeForces 311 B Cats Transport 斜率优化DP

    题目传送门 题意:现在有n座山峰,现在 i-1 与 i 座山峰有 di长的路,现在有m个宠物, 分别在hi座山峰,第ti秒之后可以被带走,现在有p个人,每个人会从1号山峰走到n号山峰,速度1m/s.现 ...

  5. CF999C Alphabetic Removals 思维 第六道 水题

    Alphabetic Removals time limit per test 2 seconds memory limit per test 256 megabytes input standard ...

  6. hdu3746(kmp最小循环节)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3746 题意:问在一个字符串末尾加上多少个字符能使得这的字符串首尾相连后能够循环 题解:就是利用next ...

  7. 如何从 if-else 的参数校验中解放出来?

    背景 在开发中经常需要写一些字段校验的代码,比如非空,长度限制,邮箱格式验证等等,导致充满了if-else 的代码,不仅相当冗长,而且很让人抓狂. hibernate validator(官方文档)提 ...

  8. GC判断哪些内存需要回收

    GC的问题,主要分为:1.哪些内存需要回收?2.什么时候回收?3.如何回收?这里主要讲第一个问题. 1.哪些内存需要回收? 垃圾收集器在对堆进行回收前,第一件事情就是要确定这些对象之中哪些还“存活”, ...

  9. Jmeter介绍和安装

    Apache JMeter™应用开源软件,100%纯Java应用程序,设计用于负载功能测试和性能测试.它最初是为测试Web应用程序而设计的,但后来扩展到其他测试函数中. 安装步骤:1.安装JDK 8版 ...

  10. linux 假死分析

    所谓假死,就是能ping通,但是ssh不上去:任何其他操作也都没反应,包括上面部署的apache也打不开页面. 作为一个多任务操作系统,要把系统忙死,忙到ssh都连不上去,也不是那么容易的.尤其是现在 ...