2017-04-14 128 views
0

这是输入栏和我的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> 

控制器本次搜索的是

.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; 
      } 
     ); 

我有搜索按钮的图标,当我在搜索栏中有一个输入并点击按钮,它工作正常。当在输入框中输入一些文本后按Enter键时如何执行相同的功能?

+2

使用一个提交按钮形式....为什么试图重新发明轮子的内置浏览器的行为? – charlietfl

+0

http://stackoverflow.com/questions/17217892/how-to-trigger-the-enter-keypress –

回答

0

您可以使用ng-keyupng-keydown来捕获用户输入并检查是否按下了回车键 - 如果是,请执行特定操作。

HTML

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

控制器

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