Angular Expression not updating in view

Question

I am working on color picker where i need to select 10 colors , I need to display the value as soon as the color picker select. It is updating the value when we are selecting with for loop but it is not updating the value when we directly print value. Please check below link - https://stackblitz.com/edit/github-puzsp8-kxtfe1?file=src/app/app.component.html

I might have missed something. But not able to get. Lets assume colors is Array object and {{colors}} this will not change value {{c}} this one is updating correctly .

Why it is not updating if I print only colors . Thanks

Could you please describe a little bit more what you need exactly ? — JYOTI SAPARIYA
– JYOTI SAPARIYA, Commented Aug 28, 2018 at 9:57
{{colors | json}} seems to be working. Looks like angular issue> Actually in earlier version if you binded an object, it would simply showup as [object Object]. recently they had added this feature where they pretty print the object. You should never need to bind an object like how you are doing — Gaurav Mukherjee
– Gaurav Mukherjee, Commented Aug 28, 2018 at 9:58
@GauravMukherjee , Thanks a lot . It is working with {{colors | json}} .. I got confused because it was showing string but not updating. Thanks Again — Amit
– Amit, Commented Aug 28, 2018 at 11:27

Krishna Rathore · Accepted Answer · 2018-08-28 09:59:34Z

1

Use json pipe for this.

<span>{{colors | json}}</span>

answered Aug 28, 2018 at 9:59

Krishna Rathore

9,7475 gold badges28 silver badges50 bronze badges

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

Comments

Augustin R · Accepted Answer · 2018-08-28 09:59:10Z

1

i get the same as

{{c}}

using

{{colors.toString()}}

answered Aug 28, 2018 at 9:59

Augustin R

7,8593 gold badges30 silver badges54 bronze badges

1 Comment

Amit Over a year ago

Thanks . I checked , it was working with colors.toString() .

Gaurav Mukherjee · Accepted Answer · 2018-08-28 10:01:55Z

1

In earlier version of angular if you binded an object, it would simply show up as [object Object]. Recently they had added this feature where they pretty print the object. You should never need to bind an object like how you are doing anyways. Or if you need to, you should convert it to string first

answered Aug 28, 2018 at 10:01

Gaurav Mukherjee

6,3352 gold badges25 silver badges33 bronze badges

1 Comment

Amit Over a year ago

Thanks for the explanation. Yes Earlier I have seen it will display - [object Object]. As per suggestion need to use either pipe or toString() . Thanks

Collectives™ on Stack Overflow

Angular Expression not updating in view

3 Answers 3

Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related