快捷導(dǎo)航

AngularJS基礎(chǔ) ng-keypress 指令簡單示例

更新時間：2016年08月02日 09:42:00 投稿：lqh

本文主要介紹AngularJS ng-keypress 指令,這里對ng-keypress指令的基礎(chǔ)資料整理,并附有實例代碼,需要的小伙伴參考下

AngularJS ng-keypress 指令

AngularJS 實例

按下按鍵時執(zhí)行的代碼:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">

<input ng-keyup="count = count + 1" ng-init="count=0" />

<h1>{{count}}</h1>

<p>該實例在輸入框每次按鍵松開時，計算變量 "count" 會自動加 1。</p>

</body>
</html>

定義和用法

ng-keypress 指令用于告訴 AngularJS 在指定 HTML 元素上按下按鍵時需要的操作。

ng-keypress 指令不會覆蓋元素的原生 onkeypress 事件, 事件觸發(fā)時，ng-keypress 表達式與原生的 onkeypress 事件將都會執(zhí)行。

按鍵敲擊的事件順序:

1.Keydown

2.Keypress

3.Keyup

語法

<input>, <select>, <textarea>, 和其他可編輯元素支持該指令。

參數(shù)值

值	描述
expression	按鍵松開執(zhí)行的表達式。

以上就是對AngularJS ne-keypress指令的資料整理，后續(xù)繼續(xù)補充！

您可能感興趣的文章:

相關(guān)文章

詳細(xì)解讀AngularJS中的表單驗證編程
這篇文章主要介紹了詳細(xì)解讀AngularJS中的表單驗證編程,AngularJS是一個非常熱門的JavaScript庫,需要的朋友可以參考下
2015-06-06
Angular實現(xiàn)較為復(fù)雜的表格過濾，刪除功能示例
這篇文章主要介紹了Angular實現(xiàn)較為復(fù)雜的表格過濾，刪除功能,結(jié)合實例形式分析了AngularJS針對表格的排序、查詢匹配、頁面元素屬性動態(tài)修改等相關(guān)操作技巧,需要的朋友可以參考下
2017-12-12
angularjs使用gulp-uglify壓縮后執(zhí)行報錯的解決方法
下面小編就為大家分享一篇angularjs使用gulp-uglify壓縮后執(zhí)行報錯的解決方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-03-03
Angular中實現(xiàn)樹形結(jié)構(gòu)視圖實例代碼
近兩年當(dāng)中使用Angular開發(fā)過很多項目，其中也涉及到一些樹形結(jié)構(gòu)視圖的顯示，最近的在項目中封裝了大量的組件，一些組件也有樹形結(jié)構(gòu)的展示，所以寫出來總結(jié)一下。
2017-05-05
Angular 5.0 來了! 有這些大變化
Angular 5.0 來了! 有這些重大變化,這篇文章就為大家介紹了Angular 5.0大變化，感興趣的小伙伴們可以參考一下
2017-11-11
angular學(xué)習(xí)之從零搭建一個angular4.0項目
本篇文章主要介紹了從零搭建一個angular4.0項目，主要用到的工具angular4.0、angular-cli、npm(v3.10.8)、node(v6.2.0)，有興趣的可以了解一下
2017-07-07
3個可以改善用戶體驗的AngularJS指令介紹
這篇文章主要介紹了3個可以改善用戶體驗的AngularJS指令,AngularJS是一款具有很高人氣的JavaScript框架,需要的朋友可以參考下
2015-06-06
AngularJS控制器之間的數(shù)據(jù)共享及通信詳解
本文詳細(xì)介紹了AngularJS控制器之間的數(shù)據(jù)共享與通信，對angularjs共享數(shù)據(jù)及通信相關(guān)知識感興趣的朋友可以一起學(xué)習(xí)。
2016-08-08
AngularJs 動態(tài)加載模塊和依賴
這篇文章主要介紹了AngularJs 動態(tài)加載模塊和依賴方法的相關(guān)資料,需要的朋友可以參考下
2016-09-09
Angular 利用路由跳轉(zhuǎn)到指定頁面的指定位置方法
今天小編就為大家分享一篇Angular 利用路由跳轉(zhuǎn)到指定頁面的指定位置方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-08-08