离子2装载机没有在正确的时间显示

Question

我在Ionic 2应用程序中使用加载程序。一开始，我有这样的菜单-

​

​

当我点击任何菜单时，它会导航到下一页。但是，由于下一页有大量的数据，加载下一页需要时间。所以，我想在点击菜单后立即显示一个加载程序。 我目前正在使用加载程序，但是它是在打开下一页时显示的，也就是说，在单击菜单之后，我不会立即看到加载程序，而是在加载下一页之后。 我的代码如下-

homepage.html (网格代码)

<ion-content>
    <ion-grid>
        <ion-row wrap>
            <ion-col ion-card width-33 *ngFor="let menuItem of menuData" (tap)="itemTapped($event, menuItem)">
                <ion-card text-center>
                <ion-icon [name]="menuItem.category_icon" class="menuIcon"></ion-icon>/
                    <p>{{menuItem.category_name}}</p>
                </ion-card>
            </ion-col>
        </ion-row>
    </ion-grid>
</ion-content>

homepage.ts

itemTapped(event, menuItem) {
    this.loading = this.loadingCtrl.create({
        content: 'कृपया प्रतीक्षा करा...',
        spinner: 'bubbles',
        dismissOnPageChange: true
    });
    this.loading.present();
    this.page2Data = [];
    this.commonData.selectMenu(menuItem.category_name);
    switch (menuItem.category_name) {
        case 'क्लासेस':
        this.loadClasses(menuItem);
        break;

        case 'मोबाईल व इले.':
        this.loadElectronics(menuItem);
        break;

        .....
    }
}

所以，我想要的是在主页上显示加载程序(在点击菜单之后)，而不是在下一页。因为目前，导航到下一页需要2秒。

Answer 1

在加载程序承诺得到解决后，您可以尝试加载内容。

this.loading.present().then(() => {
   // Your logic to load content
 });