【Angular】JS事件--实现回车触发的效果

前言

  小编在接触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>

小结

  自己对于Angular JS事件以及其他方面的基础知识，了解得不是很多，还需要后期的继续积累。
感谢您的访问！