ng-submit以角度形式调用了两次

Question

我已经经历了几个关于这个问题的问题，但没有一个能解决我的问题

我正在使用一个表单，其中两个提交类型按钮调用相同的函数。一个按钮是在ng单击时发送一个额外的变量。当我提交时，我的函数被调用了两次。

我正在使用这个问题的第二个答案中讲述的方法(大部分投票(

我没有在 HTML 中包含控制器作为 ng 控制器

<form ng-submit="SaveContent(Form)">
    <button type="submit">Save</button>
    <button type="submit" ng-click="Data.IsSent = true">Save & Send</button>
</form>

如何处理这个问题？

Answer 1

角度表单文档将其指定为

如果表单具有一个或多个输入字段以及一个或多个按钮，或者 输入[类型=提交]，然后在任何输入字段中按回车键将 在第一个按钮或输入上触发单击处理程序[类型=提交] (ngClick( 和封闭表单上的提交处理程序 (ngSubmit(

我在下面的示例中插入了您的代码，它的行为与文档中指定的完全相同，并且在提交表单时只执行一次提交(第一次(

angular.module("app",[]).controller("myCtrl",function($scope){
$scope.Data ={};
$scope.Data.IsSent = false;
$scope.SaveContent = function(form){
if($scope.Data.IsSent){
  alert('submitted- and ngclick is invoked');
  }else{
  alert('submitted');
  }
  $scope.Data.IsSent = false;
};
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="myCtrl">
<form ng-submit="SaveContent(Form)">
    <input type="text" name="text1"/>
    <button type="submit">Save</button>
    <button type="submit" ng-click="Data.IsSent = true">Save & Send</button>
</form>
</div>

Answer 2

我遇到了同样的问题，花了 5 天时间才弄清楚。不要在表单的开始标记中添加 (ngSubmit(。