按ESC键

时间:2016-08-30 07:48:30

标签: angularjs angular-material

基于Angular-Material的输入/文本字段不打算在按下ESC按钮时退出搜索;对此有什么调整吗?

enter image description here

按Escape按钮时的预期视图

enter image description here

当前元素面板

enter image description here

1 个答案:

答案 0 :(得分:1)

以下是使用转义键从输入中删除焦点的示例(我认为这是您要实现的目标) - CodePen

标记

<div ng-controller="DemoCtrl" ng-app="MyApp" ng-cloak>
  <md-input-container md-theme="docs-dark" flex="">
    <label>Name</label>
    <input id="myInput" type="text" ng-keydown="inputKeydown($event)">
  </md-input-container>
</div>

JS

(function () {
  'use strict';
  angular
      .module('MyApp',['ngMaterial', 'ngMessages'])
      .controller('DemoCtrl', DemoCtrl);

  function DemoCtrl ($scope, $element) {
    var myInput = angular.element($element[0].querySelector('#myInput'));
    $scope.inputKeydown = function (event) {
      if (event.key === "Escape") {
        myInput.blur();
     }
    }
  }
})();