在输入搜索字段中输入的调用函数

Question

我的Html代码：

<div class="input-group">
                <input type="text" class="form-control" placeholder="Enter Text" ng-model="csrModel.accountNumber" />
                <span class="input-group-addon" ng-click="csrModel.search(csrModel.accountNumber)">
                    <i class="fa fa-search"></i>
                </span>
            </div>

我有输入框，我用作搜索字段。点击span我正在调用ng-click函数。 同样认为我想在用户输入输入字段中的某些文本后输入我需要调用ng-click函数。

请建议我使用什么。 我尝试使用一些表单元素，但它拧紧了我的设计。我不想改变外观和设计。

Answer 1

您可以使用

<input type="text" class="form-control" placeholder="Enter Text" 
ng-model="csrModel.accountNumber" 
ng-keyup="callOnEnter($event,csrModel.accountNumber)"/>

和JS

$scope.callOnEnter = function($event, accountNumber) {
 if ($event.keyCode === 13) {
   $scope.csrModel.search(accountNumber);
 }
}

更有棱角的方式

Answer 2

在输入和处理程序中绑定ng-keypress或ng-keyup事件，检查密钥代码并相应地继续。

<div class="input-group">
            <input type="text" class="form-control" placeholder="Enter Text" ng-model="csrModel.accountNumber" ng-keyup="submitOnEnter()"/>
            <span class="input-group-addon" ng-click="csrModel.search(csrModel.accountNumber)">
                <i class="fa fa-search"></i>
            </span>
        </div>


$scope.submitOnEnter = function () {
/*--------*/
}

Answer 3

试试这个

<div class="input-group">
                <input type="text" class="form-control" ng-keyup="keyPress($event.keyCode)" placeholder="Enter Text" ng-model="csrModel.accountNumber" />
                <span class="input-group-addon"  ng-click="csrModel.search(csrModel.accountNumber)">
                    <i class="fa fa-search"></i>
                </span>
            </div>

控制器::

$scope.keyPress = function(keyCode){
   console.log(keyCode); 
  if(keyCode == 13)
    {
      // Call the func if user enters 13 i.e for Enter
    } 



}