AngularJs + Angular Material表單提交兩次

Question

我使用AngularJs + Angular Material創建註冊表單。我遇到的麻煩是，當表單有效並提交時，它會提交兩次。我無法弄清楚爲什麼。

我沒有宣佈控制器兩次。控制器僅在路由提供程序中聲明。 我沒有同時使用ngSubmit和ngClick。

爲形式

HTML代碼

 <form 
      ng-submit="registerForm.$valid && performRegister()" 
      name="registerForm" 
      novalidate> 
      <md-input-container class="md-block"> 
       <label>Name</label> 
       <input 
        type="text" 
        name="name" 
        ng-model="register.user.name" 
        required> 
       <div ng-messages="registerForm.name.$error"> 
        <div ng-message="required">Inserisci il tuo nome</div> 
       </div> 
      </md-input-container> 
      <md-input-container class="md-block"> 
       <label>Email</label> 
       <input 
        type="email" 
        name="email" 
        ng-model="register.user.email" 
        ng-pattern="pattern.emailPattern" 
        required> 
       <div ng-messages="registerForm.email.$error"> 
        <div ng-message="required">Inserisci la tua mail</div> 
        <div ng-message="pattern">Devi inserire una mail valida</div> 
       </div> 
      </md-input-container> 
      <p> 
       <md-button 
        type="submit" 
        class="button-block">Register</md-button> 
      </p> 
     </form> 

控制器

SOS.controller("RegisterController", ["$scope", "$rootScope", "config", 
function($scope, $rootScope, config) { 
    $scope.register = { 
     user: { 
      name: null, 
      email: null, 
     } 
    } 
    $scope.pattern = { 
     emailPattern: config.emailPattern 
    } 
    $scope.performRegister = function(){  
     console.log($scope.register.user); 
    } 
}]); 

每次我提交使用提交按鈕的形式中，performRegister（）函數被調用兩次，我看到在控制檯中的消息兩次。 如果我使用回車鍵提交表單，則會提交一次。 任何想法爲什麼發生這種情況？ 非常感謝。

Answer 1

我在我的應用程序中有類似的問題。這是我爲解決它而做的。

我在md按鈕中添加了'ng-click =「performRegister（）」（以您的代碼爲例），&從'form'標籤中刪除了相同的功能。

所以最後它看起來像：

<form 
     ng-submit="registerForm.$valid" 
     name="registerForm" 
     novalidate> 
    .. 
    ... 
<md-button type="submit" ng-click="performRegister()" 
       class="button-block">Register</md-button> 

讓我知道，如果這有助於。