Month: June 2022

Reusable Component Pieces with ngTemplateOutlet

tldr; ng-template, ng-container, and ngTemplateOutlet provide the ability to reuse content inside an Angular component. Understanding what’s going on and how to use these methods allows a developer to build what they want without needing to duplicate parts of the template. Explanation of the Problem Have you ever needed to use *ngIf in your template, and …

Reusable Component Pieces with ngTemplateOutlet Read More »

An Introduction to Angular Material Form-Fields

Introduction In this post, we will take a look at the Angular Material Form-Field Component. Why you would want to use a Form-Field component and what effect does it have on other components that are wrapped in a Form-Field. What we’ll cover in this post. What is a mat-form-field component?What components does form-field support?Styling a form-field …

An Introduction to Angular Material Form-Fields Read More »

Typescript Reactive, Data-Driven Finite State Machine

Finite State Machine diagram courtesy of brilliant.org Introduction A Finite State Machine (FSM) is a theoretical model of computation based on a discrete, finite number of states. The machine can only be at one state at one ‘time’. Input data is provided to the machine along with a transition function for each state. The transition …

Typescript Reactive, Data-Driven Finite State Machine Read More »

Configure your Angular apps with an injection token

In my previous story I described the concept of dependency injection in Angular through the metaphor of ordering coffee in a cafe. Players of dependency injection in Angular: provider, injector and requesting component Today we are going to have a look at a practical use case — how you can configure your apps with InjectionToken. Use Case Let’s …

Configure your Angular apps with an injection token Read More »

“Fake it till you make it” or how to mock backend response in an Angular application

We, frontend people, can control huge amount of things on the client side (in the browser or in the web app itself). We can implement the best user experience and visualize data in the best way… as long as there is data. No data — no app. At this point, the infamous “Fake it till you make …

“Fake it till you make it” or how to mock backend response in an Angular application Read More »