VirtualScroll, VirtualItem does not work on PopoverPage


#1

My main page has a popover which has to display a list that I have in an object called “indices” when printing with a * ngFor it found me perfectly, the problem I have is that this list can have between 50 and 2000 items so which when printing with the * ngFor becomes very slow or the memory gives error, so I wanted to put a VirtualScroll but it does not display anything.

My system information:

Cordova CLI: You have been opted out of telemetry. To change this, run: cordova telemetry on.
6.5.0

Ionic Framework Version: 2.2.0
Ionic CLI Version: 2.2.3
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.1.4
ios-deploy version: 1.9.1
ios-sim version: 5.0.13
OS: macOS Sierra
Node Version: v7.10.0
Xcode version: Xcode 8.3.2 Build version 8E2002

popover.html:

<ion-content>
      <ion-list [virtualScroll]="indices" [approxItemHeight]=" '40px' ">
        <ion-item *virtualItem="let item">
          {{ item.indice }}
        </ion-item>
      </ion-list>
</ion-content>

popover.ts:

import { Component } from '@angular/core';
import { NavController, NavParams, ViewController } from 'ionic-angular';
import { Content } from 'ionic-angular';


@Component({
  selector: 'popover',
  templateUrl: 'popover.html'
})
export class PopoverVisualizadorPage {
  indices: any[] = [];
 
  constructor(public navCtrl: NavController, public navParams: NavParams,private viewCtrl: ViewController) {
  }

    ngOnInit() {
    if (this.navParams.data) {
      this.indices = this.navParams.data.indices;
      console.log(this.indices);

    }
  }

}