BOOnZ
BOOnZ

Reputation: 848

angular template *ngIf compare against array

I have a list of users displayed using *ngFor in component.html.

<div *ngFor="let user of users; let i=index">
    <div *ngIf=" ... if user.id in whitelistIDs ... ">
        selected!
    </div>
    <div #else not selected..>
</div

The array in the component.ts.

whiteListIDs = [ "id1", "id2", ... ];

Is this possible?

Upvotes: 0

Views: 1548

Answers (2)

Sajeetharan
Sajeetharan

Reputation: 222572

You should call the *ngIf using a function in component.ts

<div *ngFor="let user of users; let i=index">
    <div *ngIf="checkUser(user.id)">
        selected!
    </div>
    <div #else not selected..>
</div>

and in component.ts

checkUser(id:any){
   return this.whitelistIDs.indexOf(id:any) > -1;
}

Upvotes: 0

David Anthony Acosta
David Anthony Acosta

Reputation: 4910

yes...

Check if the item is in the array like so:

<div *ngFor="let user of users; let i=index">
    <div *ngIf="whitelistIDs.indexOf(user.id) > -1; else notSelected">
        selected!
    </div>
    <ng-template #notSelected>
        Your id is whitelisted!
   </ng-template>
</div

if the item is in the array, then it will have an index, which for arrays, starts at 0, 1, 2, 3, etc. So you therefore check if it's 0 or higher. If it is, you know that it is in the array. if it's less than 0, u know it's not in the array.

Upvotes: 2

Related Questions