Introduction In Angular, there are a few ways to render templates and components dynamically. There is ngTemplateOutlet that can render different instances of ng-template conditionally. When we use components, we can apply ngComponentOutlet to render the dynamic components the simple way or ViewContainerRef the complex way. In this…
When we build applications, sharing state is something important. In Angular, we have a few ways to communicate and share state in our components using EventEmitter and services to share state with Subject or BehaviorSubject, but one of the lesser-known but valuable Angular features is exportAs. The exportAs…
Introduction This post wants to illustrate how to use switchMap operator to cancel previous HTTP requests and retrieve the latest Pokemon by an id. It is an important technique to preserve scarce network resource on a device such as mobile phone that has limited data plan. It also improves performance…
Introduction This post wants to illustrate how powerful RxJS is when building a reactive user interface in Angular. The application is consisted of a group of buttons that can increment and decrement Pokemon id. When button click occurs, the observable emits the new id and renders the images…
A Glimpse of Life Without NgModules This article is a brief overview of what it means to bootstrap your app, defining NgModules and a guide of how to initiate your apps without NgModules. Bootstrapping Meaning and What are NgModules? To “bootstrap” an application typically means to set up…
What is ngTemplateOutlet? ngTemplateOutlet is a structural directive in Angular that allows you to insert a template into the DOM based on a condition. It is particularly useful when you need to render different content based on specific conditions. The key advantage of using ngTemplateOutlet over other conditional…
Re-published with the permission of the author, Sander Elias In this article, I will go into the Why, What, and Wherefor of Angular Signals. And why this is such a big deal that everyone seems to have an opinion on. How will it be a complementary technology to…
Introduction This is day 20 of Wes Bos’s JavaScript 30 challenge where I build a speech detection application using RxJS, Angular standalone components and Web Speech API. Angular not only can call it’s own APIs to render components but it can also interact with Web Speech API to…
Introduction This is day 6 of Wes Bos’s JavaScript 30 challenge where I create real-time search input box to filter out cities and states in the USA. This is a challenge for me because I had to rewrite the original real-time search using Angular and adopting the styles…