Tutorials, guides and articles on Angular framework.

Angular Loading Spinner on HTTP Request

Loading spinners are an essential requirement for any Angular app to indicate the application is busy. This is often the case when an HTTP request is in progress. While it is possible to manually show and hide a loading spinner, we can avoid code duplication with a custom HttpInterceptor. In…

  • Post category:Angular
  • Post comments:4 Comments
  • Reading time:4 mins read

Writing an Angular Pipe to Display TimeSpan Values

I recently had an interesting problem to solve around displaying TimeSpan values in Angular. Introduction My API happens to be written in .NET Core using C#, which returns a timespan representing a duration value. Our aim is to convert TimeSpan values to the display format 1d 1h 10m. As an…

  • Post category:Angular
  • Post comments:0 Comments
  • Reading time:3 mins read

Angular Routing and Navigation Tutorial

Implement routing in Angular to enable navigation from one view to another. Users click buttons, anchor links and select options in drop-downs to perform tasks in web applications. Routing plays a key role in any modern web application and Angular makes it very easy to implement routing with router outlet.…

  • Post category:Angular
  • Post comments:0 Comments
  • Reading time:11 mins read

Downloading Files in Angular

In this post, I will show you how to download a file in Angular from a remote web API. CSV files, Excel spreadsheets, Word documents, PDF reports and images are common types of files that a functional Angular web app may need to download. In most cases, back-end APIs return…

  • Post category:Angular
  • Post comments:1 Comment
  • Reading time:4 mins read

Creating a Scalable Angular Project Structure

In this post, we create a scalable Angular project structure that is ideal for medium to large applications. Introduction Although Angular CLI does a great job at generating a new project, it does not force you to use a specific folder structure. Your initial project contains a single module, which…

  • Post category:Angular
  • Post comments:5 Comments
  • Reading time:5 mins read

Angular Logging Made Simple with ngx-logger

In my previous post, I talked about catching all errors in Angular with a global error handler. If you want to keep the errors you capture, you need to implement a reliable logging mechanism. Today, I want to explain how to enable Angular logging in your applications with ngx logger…

  • Post category:Angular
  • Post comments:16 Comments
  • Reading time:6 mins read

Global Error Handling in Angular – Step by Step Tutorial

In this post, we will implement global error handling in Angular. Global error handling is one of the first things I implement in a new project. It helps avoid repetitive try/catch blocks in Angular components, services or directives. It gives me confidence that all errors will be captured consistently. Create…

  • Post category:Angular
  • Post comments:0 Comments
  • Reading time:2 mins read

Getting Started with Angular Step by Step

Angular is a single page application (SPA) development framework for well-structured, testable and maintainable front-end applications. It is one of the most-widely used application framework in the world. According to Stack Overflow Developer Survey, Angular is used by 36.9% participants. Angular's popularity is due to its compatibility across platforms. Apps…

  • Post category:Angular
  • Post comments:0 Comments
  • Reading time:6 mins read