ReactiveForms在角2生成JSON空值或空對象爲我的可選字段

我有一個問題，與我要創造我的對象將其發送給我的API在角2反應形式，但我也ReactiveForms不產生必填字段和formgroup。ReactiveForms在角2生成JSON空值或空對象爲我的可選字段

如果我直接我的感謝對象發送HTTP POST請求我有這樣的JSON：

MyObject{ 
Name:"toto" 
Surname:"" 
    Address:{ 
    City:"", 
    StreetName:"" 
    } 
}

但我想這個JSON與API達成一致。（如果爲空或null屬性/對象我得到一個錯誤，因爲字段存在，但不是有效的：

MyObject{ 
Name:"toto" 
}

因爲姓氏和地址是optionnal

我用ReactiveForm與formBuilder，我不知道我僅能夠獲得填補領域

該如何創建我的方式：

myForm: FormGroup; 
myUserModel : UserModel; // (Interface UserModel such as my form fields) 

constructor(private fb : FormBuilder){} 

createForm(){ 
    this.myFrom = this.fb.FormGroup({ 
     Name:['';Validators.requires], 
     Surname:'', 
     Address:this.fb.FormFroup({ 
      City: '', 
      StreetName:'' 
     }) 
    }) 
} 

onSubmit(){ 
    this.myUserModel = this.myForm.value; 
    this.registerUserToAPI(this.myUserModel); 
}

欺騙我用這一點，但它是如此骯髒...：

cleanObjectToSend(obj){ 
    return this.removeEmptyObj(this.removeEmptyAttribute(obj)); 
    } 

    removeEmptyAttribute = (obj) => { 
    Object.keys(obj).forEach(key => { 
     if (obj[key] && typeof obj[key] === 'object') this.removeEmptyAttribute(obj[key]); 
     else if (obj[key] == null || obj[key] == '') delete obj[key]; 
    }); 
    return obj; 
    }; 

    removeEmptyObj(obj){ 
    Object.keys(obj).forEach(key => { 
     if (obj[key] && typeof obj[key] === 'object') { 
     if(Object.keys(obj[key]).length===0 && obj[key].constructor == Object){ 
      delete obj[key]; 
      return; 
     } 
     else this.removeEmptyObj(obj[key]); 
     } 
     else if (obj[key] == null || obj[key] == '') delete obj[key]; 
    }); 
    return obj; 

    }

它允許我只獲得非空和非空字段來生成我的JSON。

我怎麼能有一個乾淨的JSON JSON的情況下直接空或空值？

來源

2017-09-01 benji2092

好的，您的回答LazarLjubenović但是沒有其他方法可以使它成角度嗎？使用其他表單類型，例如Template Driven Form和ngModel？

更新：

我覺得這是更好的方式來清潔您的JSON對象，而無需刪除。它適用於嵌套對象！

JSON.stringify(myModel,this.replacer); 

replacer(key,value){ 
if(value == null || value == '' || (Object.keys(value).length === 0 && value.constructor == Object) || value == {}) 
    return undefined; 
else if(value && typeof value === 'object'){ 
    let isEmptyObject = true; 
    Object.keys(value).forEach(key => { 
    if(value[key] != null && value[key] != ''){ 
     isEmptyObject = isEmptyObject && false; 
    } 
    }); 
    if(isEmptyObject) return undefined; 
    else return value; 
} 
else return value; 
}

來源

2017-09-02 08:29:21 benji2092

將這個工作嵌套的對象？ –

是的，它完美的作品！ – benji2092

我可以看到它只適用於一個嵌套bt不深的嵌套權利？對不起，我想念任何事 –

他們因爲你輸入了他們而存在。（我已經編輯你的代碼，因爲它有奇怪的語法錯誤和錯別字。）

this.myFrom = this.fb.group({ 
    Name: ['', Validators.required], 
    Surname: '', 
    Address:this.fb.group({ 
     City: '', 
     StreetName: '', 
    }) 
})

如果用戶不接觸的形式，這些值將保持爲你寫他們。空字符串也是值。

什麼，你可以嘗試使用undefined爲默認值。

this.myFrom = this.fb.group({ 
    Name: [undefined, Validators.required], 
    Surname: undefined, 
    Address:this.fb.group({ 
     City: undefined, 
     StreetName: undefined, 
    }) 
})

但是，如果用戶來到現場，類型的一封信，然後離開，這將又是一個空字符串。因此，沒有真正的方法可以自動執行所需的操作，因爲它是基於您的API的自定義邏輯。

我建議你修復服務器。一個空字符串通常是「未輸入」的，而不是「錯誤的格式」或其他。發送一個空字符串不應該算作任何值已輸入，除非一個空字符串可能對某些領域的有效值;但事實並非如此。

來源

2017-09-01 23:13:10

ReactiveForms在角2生成JSON空值或空對象爲我的可選字段

回答

相關問題