我對 Angular 應用程式的表單值進行了大量檢查,我需要重構。
`
((this.dropdownSearchForm.get('name').value === undefined || this.dropdownSearchForm.get('name').value === null || this.dropdownSearchForm.get('name').value.length === 0) &&
(this.dropdownSearchForm.get('status').value === undefined || this.dropdownSearchForm.get('status').value === null || this.dropdownSearchForm.get('status').value.length === 0) &&
(this.dropdownSearchForm.get('address').value === undefined || this.dropdownSearchForm.get('address').value === null || this.dropdownSearchForm.get('address').value.length === 0) &&
(this.dropdownSearchForm.get('edu').value === undefined || this.dropdownSearchForm.get('edu').value === null || this.dropdownSearchForm.get('edu').value.length === 0) &&
(this.dropdownSearchForm.get('salary').value === undefined || this.dropdownSearchForm.get('salary').value === null || this.dropdownSearchForm.get('salary').value.length === 0));
`
我如何使用 Typescript utils 簡化它以用最少的代碼實作相同的結果?
注意:Angular forms touch 或 pristine 不起作用。因此,檢查此邏輯以驗證表單值。
我嘗試檢查型別,但由于某種原因它不起作用。
uj5u.com熱心網友回復:
所以看起來您正在檢查每個表單的值是undefined、null還是0。
您的條件似乎是在驗證每個控制元件是否包含這些值之一。
由于這些值都是假的,我認為你可以這樣做......
checkEm() {
const vals = [
this.dropdownSearchForm.get('name').value,
this.dropdownSearchForm.get('status').value,
this.dropdownSearchForm.get('address').value,
this.dropdownSearchForm.get('edu').value,
this.dropdownSearchForm.get('salary').value,
]
// Make sure every value is falsy (!{falsy_value} = true):
return vals.every(val => !val)
}
uj5u.com熱心網友回復:
您可以嘗試類似的操作:
this.myForm = fb.group({
field1: [null],
field2: [null]
// more fields
}, {validator: this.myValidator})
然后在您的驗證器中迭代您組中的表單控制元件,總結并根據有效與否回傳錯誤或空值:
myValidator(group: FormGroup) {
let sum = 0;
for(let a in group.controls) {
sum = group.get([a]).value;
}
return sum > 10 ? { notValid: true} : null
}
在模板中,您可以顯示錯誤:enter code here
*ngIf="myForm.hasError('notValid')"
uj5u.com熱心網友回復:
根據Tanner 的回答,您可以自己傳入密鑰并讓回圈處理該this.dropdownSearchFor.get(...).value部分。
checkEm() {
const vals = [
'name',
'status',
'address',
'edu',
'salary'
]
// Make sure every value is falsy (!{falsy_value} === true):
return vals.every(val => !this.dropdownSearchForm.get(val));
}
根據問題的內容,您的原始代碼似乎是錯誤的,因為您似乎想確保每個值都是真實的
該代碼如下所示:
checkEm() {
const vals = [
'name',
'status',
'address',
'edu',
'salary'
]
// Make sure every value is truthy:
return vals.every(val => this.dropdownSearchForm.get(val));
}
uj5u.com熱心網友回復:
請嘗試使用此代碼段:
(!this.dropdownSearchForm.get('name').value &&
!this.dropdownSearchForm.get('status').value &&
!this.dropdownSearchForm.get('address').value &&
!this.dropdownSearchForm.get('edu').value &&
!this.dropdownSearchForm.get('salary').value);
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/535081.html
