如何触发输入键

Question

This is the input bar and search button for my HTML

<div>
    <div class="input-group search-bar">
        <input type="text" class="form-control search-box" placeholder="Search people" autofocus="" ng-model="searchPeople">
        <a ui-sref="index.peoplesearch({searchPeople : searchPeople})" class="input-group-addon search-box btn-primary btn-search">
            <i class="glyphicon glyphicon-search"></i>
        </a>
    </div>
   <div ng-repeat = "people in searchResultsPeople">
          {{people.name}}
</div></div>

The controller for this search is

.controller('PeopleSearchController',function($scope,$http,$stateParams) {
var searchResultsPeople = $http.get(URL + SEARCH_PEOPLE + APIKEY + QUERY + searchPeople);
        searchResultsPeople.then(
            function (response) {
                $scope.searchResultsPeople = response.data.results;
                $scope.searchForPeople = true;
                console.log(response.data.results);
            },
            function(response) {
                $scope.message = "Error: "+response.status + " " + response.statusText;
            }
        );

I've an icon of search button and when I have an input in the search bar and click the button, it is working fine. How to do the same function when I press enter after some text is entered in the input box ?

Answer 1

You can use ng-keyup or ng-keydown to capture user input and check to see if the enter key was pressed - if so, perform a specific action.

HTML

<input type="text" class="form-control search-box" ng-keyup="myKeyupHandler($event);"
       placeholder="Search people" autofocus="" ng-model="searchPeople"/>

Controller

$scope.myKeyupHandler = function (event) {
  var enter = 13;
  if (event.keyCode === enter) {
    // perform some action
  }
};