Customized Deferred Loading with “when”

Last month, I introduced the defer block and its trigger options to perform lazy-loading of a template block with various options.

One of the most flexible ways to user defer is to use the when condition because it allows us to load some code based on a boolean value – which means we have complete control over when to switch that value to true.

Maybe we want to do it once we receive a response from the server or wait for the user to click on a button, or both, for instance:

Another interesting feature is that when can be combined with other triggers. In that case, the first condition to be met would lazy-load the block of code, acting similarly to a logical OR:

And, of course, we can still use a placeholder to display before the block is loaded, as illustrated above.

Alain Chautard

Alain is a Google Developer Expert in Web Technologies, Angular, and Google Maps. His daily mission is to help development teams adopt Angular and build at scale with the framework. He has taught Angular on all six continents! A world traveler and photographer, Alain is also an international conference speaker, and a published author of several video courses.