角4表單驗證

Question

如何通過單擊外部鏈接（即標籤外側）驗證角4中的表單。如果表單有效，則使用表單數據執行一些操作，否則顯示驗證消息。如果表單有效，我不想提交表單只需要獲取表單字段值。

Answer 1

這就是我的回答後另一個問題：

最簡單的方法是使用活性形式，如：

代碼：

import {ReactiveForm, FormBuilder, Validators} from '@angular/form'; 
    export class SignupFormComponent implements OnInit { 
     userForm: FormGroup; 
     firstName: string; 

     constructor(private _formBuilder:FormBuilder){} 

     ngOnInit() { 
     this.userForm = this._formBuilder.group({ 
      'firstName': ['',[Validators.required,Validators.minLength(5)]] 
     }); 
     } 

     onSubmit() { 
     console.log(this.firstName); 
     } 
    } 

HTML：

 <form [formGroup]="userForm" (ngSubmit)="onSubmit()" name="userForm"> 
      <div class="form-group"> 
      <label>First Name</label> 
      <input type="text" [(ngModel)]="firstName" class="form-control" formControlName="firstName"> 
      <p *ngIf="userForm.controls.firstName.invalid && (userForm.controls.firstName.dirty || userForm.controls.firstName.touched)"> Error message </p> 
      </div> 
      <button type="submit" class="btn btn-primary" [disabled]="userForm.invalid">Submit </button> 
     </form>