While the documentation of Angular routing is great, it does not cover some edge cases and troubleshooting of missing imports or duplicate paths in different submodules. So, in this story I decided to describe the ways you can break it. We will learn what can go wrong when configuring Angular routing and — through pain and suffering — how …
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 …
Here are the results Continue reading on ngconf »
tldr; Each Angular component has a lifecycle that lasts from the time the component is added to the page until it is removed from the page. There are several times to hook into the lifecycle, where you can run some code necessary for the component. We’ll look at a few of the most common hooks. Angular …
tldr; Reactive forms in Angular are a convenient way to manage your forms and react to changes made by the user. One issue with them has been that the value of the form has not been typed. Because of this, you could improperly access a value from a form and not know until runtime. Angular …
tldr; For years, Angular has been organized and built on top of modules. These modules grouped functionality inside your app. Components, pipes, services, and directives that had related purpose were grouped together and declared inside modules, which would need to be imported in another part of the app to be used. This pattern works, and …
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 …
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 »
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 »
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 »
Join our exclusive newswire for ng-conf news, workshops, sessions, speakers announcements, and more as we count down to ng-conf!
Join our exclusive newswire for speaker announcements, workshops, sessions info and all the latest ng-conf info.
