AngularJS - 如何在不提交表单的情况下使用ng-click?

时间:2014-09-23 18:37:07

标签: angularjs forms angularjs-ng-click ng-submit

我有一个同时具有ng-click和ng-submit的表单。

ng-submit用于提交,而ng-click调用单独的函数,如上传等。

如何确保ng-click不会意外提交表单?

谢谢你!

1 个答案:

答案 0 :(得分:48)

ngClick 提交表单。

有时,您可能会遇到问题,因为button中有两个form元素,并且都提交了它们。为避免这种情况,请在其上指定类型"button"。示例:



function demo ($scope) {
  
  $scope.doSubmit = function () {
    alert('I submit');
  };
  
  $scope.doClick = function () {
    alert('I click');
  };
  
}

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

<div ng-app ng-controller="demo">
  
  <form ng-submit="doSubmit()">
    <button type="button" ng-click="doClick()">click</button>
    <button type="submit">submit</button>
  </form>
  
</div>
&#13;
&#13;
&#13;