Angular 2表單驗證錯誤

Question

在角度2中，我只想在用戶離開字段區域之后進行客戶端驗證。 這是因為，當用戶輸入電子郵件或電話之類的字段時，他們總是會拋出錯誤，直到他們完成完整的電子郵件鍵入為止，這並不是最佳的用戶體驗。

目前我已經使用

address1: ['', Validators.compose([Validators.required, 
              Validators.maxLength(128), Validators.minLength(5)])],

模板：

<div class="addres">
    <label class="form_label asterisk">Address Line 1</label>
    <textarea class="form_input " formControlName="address1"></textarea>
    <div class="error" *ngIf="addDealerForm.controls['address1'].errors && (addDealerForm.controls['address1'].touched)">
        <div *ngIf="addDealerForm.controls['address1'].hasError('required')">
            Address1 is required.
        </div>
        <div *ngIf="addDealerForm.controls['address1'].hasError('maxlength')">
            Exceeded maximum character length.
        </div>
        <div *ngIf="addDealerForm.controls['address1'].hasError('minlength')">
            Enter minimum character length.
        </div>
    </div>
</div>

幫助我解決該問題。

Answer 1

我認為您需要對(blur)方法進行驗證。 對於前

// 零件

 onBlur() {
        this.formControl.get(name).setValidators('', [Validators.minLength(3));
    }

//表格

<textarea class="form_input " formControlName="address1" (blur)="onBlur()"></textarea>

這有幫助嗎

也看到此討論可能會有所幫助