2017-09-13 107 views
0

我有一個3字段的形式 - 名字,姓氏,身份證號碼 - 我想要設置,以便用戶必須輸入數據到兩個名稱字段或輸入表格的ID號碼以使其有效並「可提交」。角度2+反應形式驗證 - 這個或那

我的代碼是

ngOnInit() { 
    this.person = this.fb.group({ 
     'fname': [], 
     'lname': [], 
     'certID': [] 
    },{ 
     validator:(formgroup:FormGroup)=>{ 
     return this.validateInput(formgroup); 
     } 
     } 
    ); 
    } 

    validateInput(formgroup:FormGroup){ 
    if(formgroup.controls["fname"].value && formgroup.controls["lname"].value || formgroup.controls["certID"].value){ 
     console.log('OK'); 
     return {validateInputData:true}; 
     } 
     else { 
     console.log('Not OK'); 
     return null; 
     } 
    } 

雖然這驗證當表單/頁面加載運行,並生成一個「失敗」(「不正常」),提交按鈕是仍然活躍:

<button type="submit" class="btn btn-success" 
[disabled]="submitPending || person.invalid"> 
Submit<span *ngIf="submitPending" class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></span> 
</button> 

我哪裏錯了?

回答

1

您的退貨聲明是否向後?

返回null當一切正常時,錯誤,當它不正確。

if((formgroup.controls["fname"].value && formgroup.controls["lname"].value) 
       || formgroup.controls["certID"].value){ 
    console.log('OK'); 
    return null; 
    } 
    else { 
    console.log('Not OK'); 
    return {validateInputData: true}; 
    } 

'validateInputData'屬性將成爲錯誤集合中錯誤的名稱。