AngularJS - how to use ng-click without submitting

2019-04-04 07:31发布

问题:

I have a form that has both ng-click and ng-submit.

ng-submit is meant for the submission, while ng-click calls a separate function like upload, etc.

How do I make sure that ng-click does not accidentally submits the form?

thank you!

回答1:

ngClick does not submit the form.

Sometimes, you can have problems because you have two button elements in your form, and they both submit it. To avoid that, specify the type "button" on it. Example :

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>