【Angular】JS事件--實現回車觸發的效果
阿新 • • 發佈:2019-01-01
前言
小編在接觸Angular的專案過程中,真得是邊除錯專案bug,邊探索邊成長著。下面小編將使用Angular js中的事件,實現回車觸發的效果。一、第一種嘗試使用keydown
這種方法,使用的是ngForm的方法,與元件typeScript檔案中的資料和方法進行響應。
<input class="form-control " type="text" [(ngModel)]="info" (keydown)="query(searchbox.value)" style="display:inline;width:90%" placeholder="字典編碼或管理內容進行搜尋"
#searchbox>
這個方法太靈活了,決定換個方法。
二、使用Angular JS回車事件觸發
這種方法,呼叫的是HTML中的input中的方法ng-keyup激發js事件,然後再使用JavaScript事件呼叫元件typeScript檔案的方法;
<input class="form-control " type="text" [(ngModel)]="info" ng-keyup="enterEvent($event)" style="display:inline;width:90%"
placeholder="字典編碼或管理內容進行搜尋" #searchbox />
<script type="text/javascript">
var app = angular.module('myApp', [])
.controller('ctrl', function ($scope) {
$scope.enterEvent = function (e) {
var keycode = window.event ? e.keyCode : e.which;
if (keycode == 13) {
query(searchbox.value);
}
}
});
</script>