Ionique 2 - Chargement du Contrôleur ne fonctionne pas

Je suis en train d'utiliser le récemment ajouté LoadingController de cette façon :

let loading=this.load.create({
  content: "Connexion au serveur Migal en cours..."
});

loading.present();

this.http.get(this.urlCheckerForm.value.migalUrl+'/action/MobileApp/URLChecker')
  .map(res => res.json())
  .subscribe(
    data => this.newConnection(data,loading),
    error => this.catchURLError(loading));

loading.dismiss();

En gros, je veux juste afficher mon chargement de la pop-in devant ma page est chargée, et le rejeter après.

J'ai suivi l'exemple sur Ionique 2 Documentation, mais il ne semble pas fonctionner du tout...

EDIT : Le chargement du composant ne s'affiche même pas.

OriginalL'auteur Thomas Dussaut | 2016-08-22

  1. 15

    De la question avec votre code, c'est que vous faites de la requête http et puis l'appel de la dismiss() mais la dismiss() méthode ne permet pas d'attendre la requête http à la fin. Veuillez prendre un coup d'oeil à cette plunker.

    Le code est assez explicite:

    import { NavController, LoadingController } from 'ionic-angular/index';
import { Http, Response } from '@angular/http';
import { Component } from "@angular/core";
import 'rxjs/Rx';

@Component({
  templateUrl:"home.html"
})
export class HomePage {

  private users : Array<any>

  constructor(private http: Http, private loadingCtrl: LoadingController) {

    //Create the popup
    let loadingPopup = this.loadingCtrl.create({
      content: 'Loading data...'
    });

    //Show the popup
    loadingPopup.present();

    //Get the data
    this.http.get('https://jsonplaceholder.typicode.com/users')
      .map((res: Response) => res.json())
      .subscribe(
        data => {

          //I've added this timeout just to show the loading popup more time
          setTimeout(() => {
            this.users= data;
            loadingPopup.dismiss();
          }, 1000);

          //Should be just this:
          //this.users= data;
          //loadingPopup.dismiss();
        },
        err => console.error(err)
    );

  }
}
    Il a travaillé comme un charme ! 🙂 Merci pour ton explication. J'ai oublié de l'asymétrique choses.
    Été là, fait que lol. Content d'avoir pu aider 🙂
    après loadingPopup.rejeter(); vous ne pouvez plus l'utiliser. disons que nous avons un bouton et que vous voulez montrer le loadingpopup chaque fois que l'utilisateur clique sur elle, alors vous devez recréer l'loadingpopup.

    OriginalL'auteur sebaferreras

  2. 1

    J'ai mis "le chargement.rejeter();" s'abonner {} et ça fonctionne bien 🙂

                        this.http.get(url)
                        .subscribe(data =>{
                            this.items=JSON.parse(data['_body']).results;
                            loading.dismiss();
                        },

    OriginalL'auteur Vincent H

  3. 1

    Vous pouvez utiliser les ionique ionViewLoaded() pour faire apparaître le Chargement de la manette, puis le Rejeter lorsque la Vue est chargé et le Contenu Récupéré à partir de votre Inscription.

    ionViewLoaded() {
  let lr = this.loading.create({
    content: 'Your Display Message...',
  });

  lr.present().then(() => {
    this.Yourservice.Yourfunction()
      .subscribe(res => {
        this.yourresult = res;
      });
    lr.dismiss();
  });
}

    Vous pouvez également la structure de votre code comme ce assurez-vous que l'Abonnement est terminé, avant de Rejeter le Chargeur.

    ionViewLoaded() {
      let lr = this.loading.create({
        content: 'Your Display Message...',
      });

      lr.present().then(() => {
        this.Yourservice.Yourfunction()
          .subscribe(
          data => this.yourresult = data,
          error => console.log(error),
          ()=> lr.dismiss()
          );

      });
    }

    OriginalL'auteur Donsplash

  4. 0

    Pour la dernière versione des ionique vous avez à gérer le rejeter de l'événement:

    let loading = this.load.create({
    content: "Connexion au serveur Migal en cours..."
});

loading.present();

loading.onDidDismiss().then(() => {
     do thinks..... 
});
    Eh bien, grâce à vous, le chargement du composant apparaissent, mais continue de fonctionner pour toujours 😀
    loading.present(); /* some stuff */ loading.onDidDismiss(()=>{loading.dismiss();});
    J'ai essayé cela, mais comme je l'ai dit, le spin reste à tourner pour toujours
    non, attendez, vous avez à faire le http appeler à l'intérieur de la onDidDismiss événement

    OriginalL'auteur Vanojx1