Muhammad Danish
Muhammad Danish

Reputation: 335

How to apply two ngIf on single html element with two different conditions

How to apply two ngIf on single html element with two different conditions like

div class="sidebar" *ngIf="!this.router.url === '/login'">
    <!-- *ngIf="!route.isActive('/signup' || '/login')  " -->
<div class="sidebar-overlay"></div>
<div class="sidebar-coverlay">
    <div class="sidebar-logo">...

Upvotes: 0

Views: 352

Answers (2)

porgo
porgo

Reputation: 1737

Instead of condition like this:

!route.isActive('/signup' || '/login')

you should write it as a two separate conditions:

*ngIf="!route.isActive('/signup') && !route.isActive('/login')"

So, your div should look like:

<div class="sidebar" *ngIf="!route.isActive('/signup') && !route.isActive('/login')">

Upvotes: 3

Dulanjaya Tennekoon
Dulanjaya Tennekoon

Reputation: 2508

You can use && operator, like this:

<div *ngIf="!route.isActive('/signup') && !route.isActive('/login')">
    // your code
</div>

&& operator combines the two conditions (AND operator of logic gates)

(condition1) && (condition2)

means, both condition1 and condition2 has to be true in order to display the content inside your div

Upvotes: 4

Related Questions