Angular में if डायरेक्टिव

Angular में, आप एक टैग को वेरिएबल के मान के आधार पर दिखा या छिपा सकते हैं। इसके लिए एक विशेष डायरेक्टिव *ngIf का उपयोग किया जाता है। आइए देखें कि इसके साथ कैसे काम करना है।

सबसे पहले इस डायरेक्टिव को इम्पोर्ट करना होगा:

app/app.component.tsimport {NgIf} from "@angular/common";

और डेकोरेटर के इम्पोर्ट्स सेक्शन में इसे जोड़ना होगा:

app/app.component.ts@Component({
  .....
  imports: [....., NgIf],
  ....
})

अब मान लीजिए कि हमारे पास निम्नलिखित वेरिएबल है:

app/app.component.tsexport class AppComponent {
  public isAdmin: boolean = true;
}

आइए एक div बनाएं जो तभी दिखाई देगा जब इस वेरिएबल का मान true हो:

app/app.component.html<div *ngIf="isAdmin">
  text
</div>

और अब ऐसा करें कि div तभी दिखाई दे जब हमारे वेरिएबल का मान false हो:

app/app.component.html<div *ngIf="!isAdmin">
  text
</div>