How to use ngIf without an extra element in Angular2? Last Updated : 15 Jul, 2025 Comments Improve Suggest changes Like Article Like Report In order to use *ngIf without an extra element in Angular 2+, we can use either <ng-container> or <ng-template>But in many cases, <ng-container> is recommended.The best scenario regarding the usage of with *ngIf without an extra element is mentioned below. app.component.ts: javascript import { Component } from '@angular/core'; @Component({ selector: 'my-app-table', template: './app.component.html', styleUrls: [ './app.component.css' ] }) export class AppComponent { India=[{city:'Hyderabad'}, {city:'Mumbai'}] } app.component.html : html <h1>ng-container example</h1> <div *ngFor="let state of India"> <ng-container *ngIf="state.city"> <p> {{ state.city }} </p> </ng-container> </div> Illustration of above code for ng-container If we inspect it then we can see there is no extra element added after <div> tag and before <p> tag. Comment More infoAdvertise with us Next Article How to apply filters to *ngFor in Angular ? B bunnyram19 Follow Improve Article Tags : Web Technologies AngularJS AngularJS-Misc Similar Reads How to use *ngIf else in AngularJS ? Introduction: The ngIf directive is used to show or hide parts of an angular application. It can be added to any tags, it is a normal HTML tag, template, or selectors. It is a structural directive meaning that it includes templates based on a condition constrained to boolean. When the expression eva 3 min read How to use Pipes within ngModel on input Element in Angular ? The ngModel directive is a directive that is used to bind the values of the HTML controls (input, select, and textarea) or any custom form controls, and stores the required user value in a variable and we can use that variable whenever we require that value. In this article, we will learn about Usin 3 min read How to call an Angular Pipe with Multiple Arguments ? Angular Pipes are a way to transform the format of output data for display. The data can be strings, currency amounts, dates, etc. Pipes are simple functions that accept an input and return a transformed value in a more technical understanding. In this article, we will see How to call an Angular Pip 3 min read How to apply filters to *ngFor in Angular ? In this article, we will see How to apply filters to *ngFor in AngularJS, along with understanding their basic implementation through the examples. NgFor is used as a Structural Directive that renders each element for the given collection each element can be displayed on the page. Implementing the f 3 min read How to use ngFor with index as value in Attribute in Angular ? NgFor is used as a structural directive that renders each element for the given collection each element can be displayed on the page. In this article, we will learn how to store the index value of ngFor in an attribute so I can utilize it. Creating Angular application & Module Installation Step 3 min read How to check an element with ng-if is visible on DOM ? ng-if directive: The ng-if directive in AngularJS is used to remove or recreate a portion of the HTML element based on an expression. If the expression inside it is false then the element is removed and if it is true then the element is added to the DOM.Syntax:<element ng-if="expression"> Cont 2 min read Like