在输入AngularJS表单时提交输入

时间:2016-08-25 18:07:48

标签: html angularjs angularjs-directive

我正在尝试在输入按钮上完成或提交输入,而不是单击提交按钮。这纯粹是通过指令吗?或者我必须添加一些JS吗?

这是我的意见:

<input type="text" ng-model='main.input' placeholder='some text' required=''/>

2 个答案:

答案 0 :(得分:8)

在输入上使用ng-keyup原生指令并在表单上启动ng-submit

<form ng-submit="submitFunc()">
    <input type="text" ng-model='main.input' placeholder='some text' required='' ng-keyup="$event.keyCode == 13 && submitFunc()"/>
</form>

答案 1 :(得分:0)

您可以使用 ng-submit 输入按钮点击 上提交表单。请参阅下面的示例

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script>
  angular.module('submitExample', [])
    .controller('ExampleController', ['$scope',
      function($scope) {
        $scope.text = 'hello';
        $scope.submit = function() {
          if ($scope.text) {
            $scope.enterText = this.text;
            $scope.text = '';
          }
        };
      }
    ]);
</script>
<div ng-app="submitExample">
  <form ng-submit="submit()" ng-controller="ExampleController">
    Enter text and hit enter:
    <input type="text" ng-model="text" name="text" />
    <input type="submit" id="submit" value="Submit" />
    <pre>list={{enterText}}</pre>
  </form>
</div>