AngularJS基礎(chǔ) ng-keypress 指令簡單示例
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-keypress="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
語法
<element ng-keypress="expression"></element>
<input>, <select>, <textarea>, 和其他可編輯元素支持該指令。
參數(shù)值
| 值 | 描述 |
|---|---|
| expression | 按下按鍵執(zhí)行的表達式。 |
相關(guān)文章
Angular2中如何使用ngx-translate進行國際化
本篇文章主要介紹了Angular2中使用ngx-translate進行國際化,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-05-05
angularjs 表單密碼驗證自定義指令實現(xiàn)代碼
這篇文章主要介紹了angularjs 表單密碼驗證自定義指令實現(xiàn)代碼,需要的朋友可以參考下2016-10-10
angular.js實現(xiàn)列表orderby排序的方法
今天小編就為大家分享一篇angular.js實現(xiàn)列表orderby排序的方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10
AngularJS輔助庫browserTrigger用法示例
這篇文章主要介紹了AngularJS輔助庫browserTrigger用法,結(jié)合實例形式分析了輔助庫browserTrigger的功能及單元測試中的使用技巧,需要的朋友可以參考下2016-11-11
解決angular2在雙向數(shù)據(jù)綁定時[(ngModel)]無法使用的問題
今天小編就為大家分享一篇解決angular2在雙向數(shù)據(jù)綁定時[(ngModel)]無法使用的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
基于angular2 的 http服務(wù)封裝的實例代碼
這篇文章主要介紹了基于angular2 的 http服務(wù)封裝實例代碼,2017-06-06
AngularJS使用ng-repeat遍歷二維數(shù)組元素的方法詳解
這篇文章主要介紹了AngularJS使用ng-repeat遍歷二維數(shù)組元素的方法,結(jié)合實例形式分析了AngularJS二維數(shù)組元素遍歷的相關(guān)操作技巧,需要的朋友可以參考下2017-11-11

