Angularjs的鍵盤事件的綁定
Angularjs的鍵盤事件的綁定
推薦button
方法一:ng內(nèi)置指令
<button ng-click="login()" ng-keypress="todoSomething($event)" class="btn btn-success btn-lg" ng-disabled="loginForm.$invalid"> 登錄 </button>
說明:在對應(yīng)的控制器中的$scope上綁定一個todoSomething方法
$scope.todoSomething=function($event){ if($event.keyCode==13){//回車 login(); } }
方法二:自定義指令
html <button ng-click="login()" ng-enter="login()" class="btn btn-success btn-lg" ng-disabled="loginForm.$invalid"> 登錄 </button>
指令
myApp.directive('ngEnter', function () { return function (scope, element, attrs) { element.bind("keydown keypress", function (event) { if (event.which === 13) { scope.$apply(function () { scope.$eval(attrs.ngEnter); }); event.preventDefault(); } }); }; });
總結(jié):兩種方法都能實(shí)現(xiàn)敲回車登錄的功能,不過推薦指令的方式,對$scope的污染比較低
關(guān)于AngularJS指令事件可以參考:http://www.dbjr.com.cn/article/119742.htm
感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!
相關(guān)文章
angularJS自定義directive之帶參方法傳遞詳解
今天小編就為大家分享一篇angularJS自定義directive之帶參方法傳遞詳解,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10AngularJS基礎(chǔ) ng-mouseover 指令簡單示例
本文主要介紹AngularJS ng-mouseover 指令,這里幫大家整理了AngularJS 指令的基礎(chǔ)知識,并附代碼示例,有興趣的小伙伴可以參考下2016-08-08在 Angular6 中使用 HTTP 請求服務(wù)端數(shù)據(jù)的步驟詳解
本文分步驟給大家介紹了在 Angular6 中使用 HTTP 請求服務(wù)端數(shù)據(jù)的方法,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價值,需要的朋友可以參考下2018-08-08angularJS實(shí)現(xiàn)動態(tài)添加,刪除div方法
下面小編就為大家分享一篇angularJS實(shí)現(xiàn)動態(tài)添加,刪除div方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02angular實(shí)現(xiàn)IM聊天圖片發(fā)送實(shí)例
本篇文章主要介紹了angular實(shí)現(xiàn)IM聊天圖片發(fā)送實(shí)例,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-05-05angularjs過濾器--filter與ng-repeat配合有奇效
本篇文章主要介紹了angularjs過濾器-filter與ng-repeat的相關(guān)知識。具有很好的參考價值。下面跟著小編一起來看下吧2017-04-04AngularJS基礎(chǔ) ng-model-options 指令簡單示例
本文主要介紹AngularJS ng-model-options 指令,這里對ng-model-options指令的基本資料進(jìn)行整理,有需要的小伙伴可以參考下2016-08-08AngularJS實(shí)現(xiàn)表單元素值綁定操作示例
這篇文章主要介紹了AngularJS實(shí)現(xiàn)表單元素值綁定操作,結(jié)合具體實(shí)例形式分析了AngularJS針對表單元素屬性相關(guān)操作技巧,需要的朋友可以參考下2017-10-10Angular中使用$watch監(jiān)聽object屬性值的變化(詳解)
下面小編就為大家?guī)硪黄狝ngular中使用$watch監(jiān)聽object屬性值的變化(詳解)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-04-04