liveBook · Manning

forEachAddedItem

As explained in Pro Angular 16

forEachAddedItem is an Angular iterable-changes method that invokes a callback for each item added to a collection.

forEachAddedItem is an Angular IterableChanges method that invokes a callback once for each new object detected in a collection. The callback receives an IterableChangeRecord describing the item and its current position. section 15.3.4

Adding product views

A custom paFor structural directive diffs its products collection. When a product is added, forEachAddedItem supplies its record, and the directive creates a view for that product at its current index instead of clearing and rebuilding every view. section 15.3.4

How Pro Angular 16 covers it

How deep it goes
Explains callback behavior and change-record properties, then demonstrates incremental embedded-view creation; deletion and modification handling remain separate.
Examples
Uses a paFor product table where clicking Create adds a product and triggers creation of one corresponding view.
What you can do after
Apply it via Angular IterableDiffer to update only views corresponding to newly detected collection items.
How it connects
Connects Angular change detection, IterableDiffer, IterableChanges, IterableChangeRecord, structural directives, and embedded views.
Cover of Pro Angular 16
liveBookmanning.com
Read Pro Angular 16 on liveBook Get the book at manning.com

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Pro Angular 16. The section links point to the parts of the book it draws on.