VirtualScroll and VirtualItem with NgIf

@MustaRohman wrote:

Hi,

I’m trying to use NgIf in conjunction with VirtualItems in a VirtualScroll. I haven’t been able to find a solution thread for this issue yet.

Here is the basic idea of what I’m trying to do:

<ion-list [virtualScroll]="list">
    <button *virtualItem="let item" *ngIf="item.prop > 3" ion-item>{{ item }}
    </button>
  </ion-list>

Of course, this results in a template parse error with multiple template bindings on one element.
I’ve tried applying the *virtualItem directive to a parent div and then applying *ngIf to the child button of that div. However, this also renders a div for each instance in the list.

How would I use the NgIf directive to filter the rendered items of the list similar to above?

Thank you

Posts: 1

Participants: 1

Read full topic