I'm converting form value to object which is passed to API after few logic. But when i convert the properties which doesn't show in the UI on a validation sets its default value to empty even if the data type is number or boolean or date.
//Class:
export class Detail{
id: number;
address: string;
active: boolean;
statusId: number;
public constructor(init?: Partial<Detail>) {
Object.assign(this, init);
}
}
//Compoennt:
let detail = new Detail(this.DetailForm.value);
console.log(detail)
where in a condition, the active and statusId field is hidden and the user just selects the id and type in address.
//on console log this gives
id:5
address: 'abc xyz'
active: ''
statusId: ''
//Expected output: I expect when the property is not set, it should have its default.
id:5
address: 'abc xyz'
active: false
statusId: 0
//Tried:
Set default value in the property class active: boolean = false
Set default value in the class in constructor.
init.active = init.active ?? false; init.statusId = init.statusId ?? 0; Object.assign(this, init);
After the Object.assign it turned back to empty
Any ideas to handle such issue for all the data types (like date too).
Juan Pablo Isaza
I would use the nullish operator:
public constructor(init?: Partial<Detail>) {
init.active = init.active ?? false;
init.statusId = init.statusId ?? 0;
Object.assign(this, init);
}
Not sure if I am missing something here but this worked for me.
export class Detail {
id: number = 5;
address: string = "abc xyz";
active: boolean = false;
statusId: number = 0;
public constructor(init?: Partial<Detail>) {
Object.assign(this, init);
}
}
const test1 = new Detail({ id: 3})
const test2 = new Detail();
const test3 = new Detail({id: 3, statusId: 4, address: "my-address"});
console.log(test1);
console.log(test2);
console.log(test3);
Expected output:
Detail { id: 3, address: 'abc xyz', active: false, statusId: 0 }
Detail { id: 5, address: 'abc xyz', active: false, statusId: 0 }
Detail { id: 3, address: 'my-address', active: false, statusId: 4 }
Since the values are empty string (not null/undefined), then you can use the OR || operator instead of nullish ??, like the following:
public constructor(init?: Partial<Detail>) {
init.active = init.active || false;
init.statusId = init.statusId || 0;
Object.assign(this, init);
}