AngularJS指令在输入时进行输入响应

时间:2015-02-16 16:08:31

标签: javascript angularjs angularjs-directive directive

如果问题含糊不清,我道歉,我不太确定如何解释我的需要。我想到了一些肮脏的选项,但我是一个新手AngularJS编码器,我觉得有一个简洁的方法来实现这个指令可能吗?

我需要的是一个输入框,它等待一个ENTER按键,并在它获取时触发并执行动作。该操作是基于在按下enter之前输入的输入从外部JSON对象获取的简单操作。

该字段还应在每个换行符按键时重置为空。

3 个答案:

答案 0 :(得分:1)

Ng-服从救援!您可以通过将输入包装在一个表单(具有名称)中来轻松地使其工作。一个很大的优点:这将适用于移动设备,他们将有一个快捷方式提交"提交"键盘旁边。



<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>

  
<form 
  name="theFormNeedsANameForNgSubmitToFire" 
  ng-submit="myScopeInfos='Enter pressed and mytext was '+mytext;mytext='';">

  <input type="text" ng-model="mytext"/>

</form>

<div>{{myScopeInfos}}</div>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

你可以使用角度keyUp directive,event.keycode == 13

<强> HTML

<input ng-keyup="enterThis($event)" ng-model=""></input>

<强>控制器

$scope.enterThis = function(event){ 
    if (event.keyCode === 13){
        //do whatever

        //clear the input
        $scope.enterInput = '';

}

答案 2 :(得分:0)

这应该让你开始:

app.directive('enter', function() {
    return function(scope, element, attrs) {
        element.bind("keydown keypress", function(event) {
            if(event.which === 13) {
            }
        });
    };
});    

要重置输入,只需将输入绑定到模型并将模型设置为空字符串。

要与服务器通信,您可以使用angular的http模块。

相关问题