角型検証が期待通りに機能しない

Question

基本的にはフォームの送信時に基本的に理解できない問題があります。
「novalidate」属性を設定してHTML5検証を無効にした後、すべてのフィールドを「必須」（電子メールの検証でメール入力と同じ）に設定しました。「ngMessages」を使用しています入力を確認するための角度（それは必要なのでしょうか？）。しかし、私はまだフィールドに記入されていないフォームを提出することができます...

私は間違って何ですか？ ng-submitを使用し、ng-clickを使用しないという事実から来ることができますか？
ご迷惑をおかけして申し訳ございません。

https://jsfiddle.net/WebMoutarde/n1mocvco/

<div ng-controller="MyCtrl"> 
    <form name="form" novalidate ng-submit="vm.signup()"> 

     <div class="list"> 
     <label class="item item-input item-stacked-label noborder"> 
      <span class="input-label">Nom</span> 
      <input type="text" name="nom" ng-model="vm.nom" required> 
     </label> 
      <hr style="border-style: solid;margin-left: 16px;margin-right: 16px;border-color: #e8e8e8;"/> 
     <label class="item item-input item-stacked-label noborder"> 
      <span class="input-label">Prénom</span> 
      <input type="text" name="prenom" ng-model="vm.prenom" required> 
     </label> 
     <hr style="border-style: solid;margin-left: 16px;margin-right: 16px;border-color: #e8e8e8;"/> 
     <label class="item item-input item-stacked-label noborder"> 
      <span class="input-label">Mail</span> 
      <input type="email" name="mail" ng-model="vm.mail" required> 
     </label> 
     <hr style="border-style: solid;margin-left: 16px;margin-right: 16px;border-color: #e8e8e8;"/> 
     <label class="item item-input item-stacked-label noborder"> 
      <span class="input-label">Mot de passe</span> 
      <input type="password" name="password" ng-model="vm.password" required> 
     </label> 
     <hr style="border-style: solid;margin-left: 16px;margin-right: 16px;border-color: #e8e8e8;"/> 
     <label class="item item-input item-stacked-label noborder"> 
      <span class="input-label">Confirmez votre mot de passe</span> 
      <input type="password" name="passwordCheck" ng-model="vm.passwordCheck" required> 
     </label> 
     <hr style="border-style: solid;margin-left: 16px;margin-right: 16px;border-color: #e8e8e8;"/> 

     </div> 
      <div ng-messages="form.$error" role="alert"> 
      <p style="text-align: center;" ng-message="required">You must fill in all fields</p> 
      <p style="text-align: center;" ng-message="email">Your email address is invalid</p> 
      </div> 
      <div class="item noborder"> 
      <button class="button button-block button-positive" type="submit" >Créer un compte</button> 
      </div> 
    </form> 
    </div> 

私はこのことについて非常に多くの質問を見てきましたが、私はまだフォームがng-disabledを使用することにより、有効な状態になるまで、あなたは無効フォームボタンを提出することができ...

Answer 1

何かが足りません書式の指示書button

<button class="button button-block button-positive" 
    type="submit" 
    ng-disabled="form.$invalid"> 
     Créer un compte 
</button> 

---

さらに、検証フォームが有効であるか、またはng-submitメソッドであることを確認してから、コントローラのsignupメソッドを以下のように呼び出してください。

ng-submit="form.$valid && vm.signup()"