Variable assigned from @Input variable also changes assigned variable

Question

In Angular6, i am getting a variable value to client from Parent using @Input()

@Input() orderdata: OrderData;

and binded to a field using [ngModel] and (ngModelChange) function.

In the child component when user changes this variable value (binded) I need to do a validation comparing the new value and old value. How to do this?

I tried assigning orderdata to a new variable

oldorderdata = orderdata;

and then later perform the comparison. But when ever user changes the orderdata at the moment itself oldorderdata is also changed.

Did you check Angular Lifecycle Hooks, especially OnChanges? — Capricorn
– Capricorn, Commented Aug 23, 2018 at 18:11

SiddAjmera · Accepted Answer · 2018-08-23 18:09:00Z

2

Generally when you assign objects to each other in JS, you're not assigning their values, you're just assigning to their memory references.

That's why when the orderdata is changed, the oldorderdata will also change since it was pointing to the same object in memory.

To prevent this, you can use the spread operator(...) in ES6 like this:

oldorderdata = {...orderdata};

This will spread all the properties from orderdata into the oldorderdata object.

answered Aug 23, 2018 at 18:09

SiddAjmera

39.6k7 gold badges78 silver badges114 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Deepak KK Over a year ago

Thanks Siddharth. Above solution plus declaring the oldorderdata as private (as advised in discussion stackoverflow.com/questions/45058145/…) resolved the problem

SiddAjmera Over a year ago

Glad I helped!!

yaxx · Accepted Answer · 2018-08-23 18:15:30Z

0

the variable will generally change since you are binding it with [(ngModel)], to make the comparison you need to bind the variable to output of the comparison function instead

answered Aug 23, 2018 at 18:15

yaxx

6552 gold badges9 silver badges24 bronze badges

1 Comment

Deepak KK Over a year ago

I ngModel binding on orderdata variable and there is no binding on oldorderdata. How change in orderdata is changing the oldorderdata?

Collectives™ on Stack Overflow

Variable assigned from @Input variable also changes assigned variable

2 Answers 2

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related