HTML5原生的表單校驗屬性（必填，長度限制，取值間隔，正則表達(dá)式等等）可以滿足普通的校驗需求，但是有些場景必須用到自定義校驗，比如注冊時的密碼確認(rèn)，有比對關(guān)系的時間/數(shù)值選擇， 需要到請求到服務(wù)端取值驗證等等···這里以密碼確認(rèn)為例進(jìn)行說明。

十年的密云網(wǎng)站建設(shè)經(jīng)驗，針對設(shè)計、前端、開發(fā)、售后、文案、推廣等六對一服務(wù)，響應(yīng)快，48小時及時工作處理。網(wǎng)絡(luò)營銷推廣的優(yōu)勢是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同，自動調(diào)整密云建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設(shè)計，從而大程度地提升瀏覽體驗。創(chuàng)新互聯(lián)從事“密云網(wǎng)站設(shè)計”,“密云網(wǎng)站推廣”以來，每個客戶項目都認(rèn)真落實執(zhí)行。

指令開發(fā)

　　表單的驗證狀態(tài)是通過 formContro l的 errors 屬性反饋出來的，所以基本的思路肯定就是需要添加校驗規(guī)則，然后將驗證結(jié)果添加到formControl實例的errors屬性中。那么問題來了，模版驅(qū)動表單的控制都是在HTML模版中完成的，無法直接接觸到 formControl實例。這個時候就需要使用指令了，將檢驗規(guī)則進(jìn)行包裝。Angular提供了 驗證器供應(yīng)商 NG_VALIDATORS ，用于處理表單自定義校驗。先創(chuàng)建指令。

import { Directive} from '@angular/core';
import { NG_VALIDATORS, Validator, AbstractControl} from '@angular/forms';
@Directive({
 selector: '[appConfirmpsw]',
 providers: [{
  provide : NG_VALIDATORS,
  useExisting : ConfirmpswDirective,
  multi: true
 }]
})
export class ConfirmpswDirective implements Validator {
 constructor() {
  }
 validate(control: AbstractControl): {[key: string]: any} {
   //檢驗規(guī)則
 }
}

新聞標(biāo)題：Angular實現(xiàn)模版驅(qū)動表單的自定義校驗功能(密碼確認(rèn)為例)-創(chuàng)新互聯(lián)
文章來源：http://weahome.cn/article/dspgjd.html