CODEWITHSUNDEEP
angular
yosra
yosra

Reputation: 1022

!x is equivalent to (x===undefined || x.length===0)

In my template I have this (the body of a table):

<tbody *ngIf="!matchesInfo && !pendingRequest">
    <tr>
      <td>
        <div class="no-matches">
          <p>There are no matches to create on the selected date</p>
        </div>
      </td>
    </tr>
  </tbody>

Where matchesInfo is an array, that may be empty or not according to the result of a subscribtion to a service:

  this.matchService.getMatchesFromSportradar(this.date).subscribe(result =>{
      this.pendingRequest = false;
      this.matchesInfo = result;
    });

The problem is, when I use <tbody *ngIf="!matchesInfo && !pendingRequest"> nothing gets displayed to the screen, while the message There are no matches to create on the selected date gets displayed when I use <tbody *ngIf="(matchesInfo===undefined || matchesInfo.length===0) && !pendingRequest">.

My question is, aren't these two If statements equivalent? Thank you in advance.

Upvotes: 2

Views: 143

Answers (3)

Art Olshansky
Art Olshansky

Reputation: 3366

You can just replace !matchesInfo to the !matchesInfo?.length (I guess you got an empty array in result, and ![] === false)

Upvotes: 2

Norbert Bartko
Norbert Bartko

Reputation: 2632

You can use !matchesInfo?.length && !pendingRequest.

This statement will be true if matchesInfo is defined and also have a property length witch is =0.

Upvotes: 2

Zacharie M&#233;n&#233;trier
Zacharie M&#233;n&#233;trier

Reputation: 306

Let's say you create an empty array simply initiated with x = []

if (x) alert("x exists");

This will fire up the alert, proving that initializing an array is enough for its existence to be true.

So in your case you need to check for its existence and that it is empty.

!x is not equivalent to (x===undefined || x.length===0)

Upvotes: 3

Related Questions