[英]Set Reactive form field value to null if user does not enter input
我有一個帶有可選輸入的 Angular 反應式表單。 如果用戶在該字段中沒有輸入任何內容並提交該字段,則表單將''(空字符串)發送到數據庫。 是否有默認的 Angular 方式將“null”作為該字段的值而不是空字符串發送到數據庫(假設該字段中沒有輸入值)?
我有一個類似的問題,我有一個文本框,當它為空時必須發送 null 而不是空字符串。 我決定在 angular 中創建一個指令,在其中我使用 hostlistener 檢查值是否為空字符串,然后將其重置為 null。
@Directive({
selector: '[appEmptyToNull]'
})
export class EmptyToNullDirective {
constructor(@Self() private ngControl: NgControl) { }
@HostListener('keyup', ['$event']) onKeyDowns(event: KeyboardEvent) {
if (this.ngControl.value?.trim() === '') {
this.ngControl.reset(null);
}
}
}
而這在 HTML 你可以使用這樣的指令
<input type="text" appEmptyToNull formControlName="firstname" />
這也可以使用 Reactive 形式的 valueChanges 屬性來完成。 您可以檢查表單字段的值是否為空,然后將其重置為 null
this.form.get("firstname").valueChanges.subscribe((response: string)=> {
console.log("valuechanges -> ",response)
if (response?.length == 0) {
this.form.get("firstname").setValue(null)
}
})
我不知道這是否是實現它的正確方法,但這是兩種可能的方法。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.