avatarTek Loon

Summary

The article discusses the benefits and use cases of Angular's ngIf else directive in web development.

Abstract

In the article, the author shares their personal experience and challenges in understanding when to use Angular's ngIf else directive. They compare their previous approach of using two *ngIf validations to the ngIf else method. The author explains that using ngIf else reduces the need for an additional if validation and allows for the reuse of the loadingView component. The benefits of this approach are highlighted, such as improved code readability and the ability to use the loadingView when retrieving or submitting data from/to a server.

Opinions

  • The author was initially unsure about when to use Angular's ngIf else directive.
  • They found that using two *ngIf validations was sufficient for most use cases.
  • After further consideration, the author discovered that using ngIf else has advantages, such as reducing the need for an additional if validation.
  • The ngIf else approach allows for the reuse of the loadingView component.
  • The author suggests that using ngIf else can improve code readability.
  • The loadingView component can be reused when retrieving or submitting data from/to a server.
  • The author promotes an AI service that they believe is more cost-effective than ChatGPT Plus(GPT-4) at 6/month (Special offer for 1/month).

Why & When You Should Use ngIf else

Photo by Adi Goldstein on Unsplash

Until a while ago, I still couldn’t convince myself when I should use Angular If Else Directives.

This is due to most of the time, writing 2 *ngIf (refer the below code) was enough to support my use case.

My 2 *ngIf validation

The ngIf else way

Why ngIf else?

After several rounds of thinking, I finally able to discover the reasons that are enough to persuade myself to use ngIf else.

  • Firstly, using ngIf else allows you to reduce one if validation. You don't have to write two *ngIf validation.
  • Secondly, you can reuse the loadingView declared above code. For e.g, you can reuse the loadingView when you're retrieving data from server or submitting data to server.

Originally published at https://tekloon.dev.

Web Development
Angular
Typescript
Recommended from ReadMedium