2016-09-10 3 views
1

Когда мой пользователь переходит на страницу группы управления Я в настоящее время выборки группы в HTTP вызова в конструкторе:ionic2 .. как решить обещание, прежде чем при загрузке страницы

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

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

} 

Так что мое требование: принести группы с сервера каждый раз, когда пользователь переходит на страницу управления группой.

То, что я хотел бы достичь, состоит в том, чтобы не отображать пустую страницу, пока группы извлекаются (и не делают http-вызов в contructor).

Кани любой совет по лучшему способу достижения этого в ionic2?

+0

Я отправил ответ, но я не уверен, какая версия ионического 2 вы используете ... Если вы не используете 'Ionic2 -beta.11' сообщите мне, и я обновлю ответ с вашей версией Ionic2. – sebaferreras

ответ

0

Если вы хотите получить данные с сервера каждый раз, когда пользователь переходит на страницу, то constructor не подходит для этого. Вместо того, чтобы делать это, мы могли бы использовать событие ionViewWillEnter.

К сожалению, мы не можем контролировать, как долго данные будут готовы, но что мы можем сделать, это позволить пользователю узнать об этом, показывая ему/ей сообщение о загрузке. Таким образом, мы избежим показывать пустую страницу, пока данные будут извлечены, а также страница будет отключена (так что пользователь не сможет взаимодействовать с ней), пока данные не будут готовы.

В Ionic2-beta.11 вы могли бы сделать что-то вроде этого:

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(); 

     }); 

    } 

} 
Смежные вопросы