2016-09-10 4 views
1

Wenn mein Benutzer navigiert zu einer Gruppe-Management-Seite, die ich zur Zeit die Gruppen in einem HTTP-Aufruf im Konstruktor holen:ionic2 .. wie Versprechen zu lösen, bevor Seite zu laden

@Page({ ..}) 
export class GroupManager { 

    constructor(private _http: Http) { 
    this._http.get(someurl) 
      .map(..) 
      .subscribe(..) 
    } 

} 

Also meine Forderung ist: die Gruppen holen vom Server jedes Mal, wenn der Benutzer zur Gruppenverwaltungsseite navigiert.

Was ich erreichen möchte ist, eine leere Seite nicht anzuzeigen, während die Gruppen abgerufen werden (und nicht http Aufruf im Contructor).

Cany jemand beraten auf eine bessere Weise, dies in ionic2 zu erreichen?

+0

ich eine Antwort geschrieben habe, aber ich bin nicht sicher, welche Version von Ionic 2 verwenden Sie ... Wenn Sie nicht 'Ionic2 mit Bitte lassen Sie es mich wissen und ich werde die Antwort mit Ihrer Ionic2 Version aktualisieren. – sebaferreras

Antwort

0

Wenn Sie die Daten vom Server immer dann abrufen möchten, wenn der Benutzer zur Seite navigiert, ist die constructor nicht der richtige Ort dafür. Anstatt es dort zu tun, könnten wir das Ereignis ionViewWillEnter verwenden.

Leider können wir nicht kontrollieren, wie lange die Daten dauern werden, aber was wir tun können, ist dem Benutzer dies bewusst zu machen, indem er ihm eine Lade-Nachricht zeigt. Auf diese Weise vermeiden wir, dass eine leere Seite angezeigt wird, während die Daten abgerufen werden. Außerdem wird die Seite deaktiviert, sodass die Benutzer nicht mehr mit ihr interagieren können, bis die Daten bereit sind.

In Ionic2-beta.11 könnten Sie so etwas tun:

import { Component } from '@angular/core'; 
import { LoadingController, NavController } from 'ionic-angular'; 

@Component({ 
    templateUrl:"page1.html" 
}) 
export class Page1 { 

    private loading : any; 

    constructor(private _http: Http, private _loadingCtrl: LoadingController) { 

    } 

    ionViewWillEnter() { 

    this.loading = this._loadingCtrl.create({ 
     content: 'Fetching groups...' 
    }); 

    loading.present(); 

    this._http.get(someurl) 
     .map(..) 
     .subscribe((data) => { 

     // ... 

     // Hide the message when the data is ready 
     this.loading.dismiss(); 

     }); 

    } 

} 
Verwandte Themen