Angular – ngFor iterate object or Maps
source link: https://www.tuicool.com/articles/hit/zmY7viI
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Sometimes you got an object or a maps and you want to iterate it with an ngFor but until today it was impossible to do without implementing your custom pipe or use some nice library.
Today angular release a new version 6.1 and looking on the release notes I found a nice feature that has been added:
common: introduce KeyValuePipe (#24319) (2b49bf7)
Using this new pipe is quite easy and straightforward. Our template will look something like that:
As you can see the only new thing we added is the keyvalue pipe at the end of our ngFor.
The component instead will be something like that:
If you need this feature go on and update your angular dependencies to 6.1.
If you enjoyed this post leave a comment and follow me on twitter @DZurico
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK