角2自定義驗證與可觀測參數

Question

我有這樣的自定義的驗證：

export const mealTypesValidator = (mealSelected: boolean) => { 
    return (control: FormControl) => { 
     var mealTypes = control.value; 
     if (mealTypes) { 
      if (mealTypes.length < 1 && mealSelected) { 
       return { 
        mealTypesValid: { valid: false } 
       }; 
      } 
     } 
     return null; 
    }; 
}; 

如果我像這樣使用它的工作原理：

ngOnInit() { 
    this.findForm = this.formBuilder.group({ 
     categories: [null, Validators.required], 
     mealTypes: [[], mealTypesValidator(true)], 
     distanceNumber: null, 
     distanceUnit: 'kilometers', 
     keywords: null, 
    }); 
} 

美中不足的是，mealSelected是我的組件上的屬性 - 當用戶選擇和取消選擇膳食時發生變化。

我如何調用上面的驗證器是使用靜態的，它永遠不會改變。

我怎樣才能得到驗證，當我使用component.mealSelected值作爲參數，如工作：

ngOnInit() { 
    this.findForm = this.formBuilder.group({ 
     categories: [null, Validators.required], 
     mealTypes: [[], mealTypesValidator(this.mealSelected)], 
     distanceNumber: null, 
     distanceUnit: 'kilometers', 
     keywords: null, 
    }); 
} 

，因爲如果我這樣做如上，它評估this.mealSelected即刻這在當時是假的 - 然後當用戶選擇一頓飯時，它不會繼續，並將其傳遞給自定義驗證器。

Answer 1

解決方案是移動我的組件內的驗證器，並使用this.mealSelected進行檢查。然後，我遇到了一個問題，驗證者在選擇/取消選擇用餐時未被觸發，我使用this.findForm.controls['mealTypes'].updateValueAndValidity();來觸發驗證。

代碼（也許可以被重構，從自定義驗證刪除參數）：

ngOnInit() { 
    this.findForm = this.formBuilder.group({ 
     categories: [null, Validators.required], 
     mealTypes: [[], this.mealTypesValidator(true)], 
     distanceNumber: null, 
     distanceUnit: 'kilometers', 
     keywords: null, 
    }); 
} 

mealTypesValidator = (mealSelected: boolean) => { 
    return (control: FormControl) => { 
     var mealTypes = control.value; 
     if (mealTypes) { 
      if (mealTypes.length < 1 && this.mealSelected) { 
       return { 
        mealTypesValid: { valid: false } 
       }; 
      } 
     } 
     return null; 
    }; 
}; 

然而它仍然將是很好能夠有一個單獨的驗證模塊集中驗證，因此，如果任何人都知道如何將變化的參數值（例如組件字段）作爲參數傳遞給自定義驗證程序 - 就像我最初問的那樣，那麼我會很欣賞這種技術的答案。