isValidフォームvaildationを実行して関数を実行するAngularJS

Question

AngularJSフォームが有効な場合、誰かが関数の実行に関するいくつかのポインタを私に与えてくれるのではないかと思います。

フォームが有効でない場合はエラーが表示されますが、送信ボタンをクリックした後にフォームが有効な場合は、フォームの次のステップ（マルチステップフォーム）に移動します。有効であれば、新しいタブや拡張可能なものを開きます。

すべてのポインタは非常に高く評価されます。

敬具、

Answer 1

フォームはformタグが

<form #contactForm="ngForm"> ... 

のように見えます

<button (click)="submit()" [disabled]="!contactForm.form.valid" type="submit" class="btn btn-primary">Submit</button> 

のような無効な場合、ボタンを無効にしてみてくださいすることができます

か、ボタンを無効にしないようにしたい場合コードから有効であるかどうかを確認してください

<button (click)="submit($event, contactForm)" class="btn btn-primary">Submit</button> 

とのあなたは、このように行うことが

submit(event:any, contactForm:NgForm): void { 
     event.preventDefault(); 
     if (contactForm.form.valid) { 
      ... 
     } 
    } 

Answer 2

機能提出：

HTML：

<form name="myForm"> 
    <div id="step1"> 
     <button type="button" ng-click="nextStep(form, validateStepOne, 2)">Next step</button> 
    </div> 
    <div id="step2">...</div> 
    <div id="step3">...</div> 
</form> 

JS：

function validateStepOne() { 
    // validate form one and return true or false 
} 

function nextStep(form, validation, nextStepIndex) { 
    if(form.$valid && validation()) { 
     // go to next step 
    } 
}