Comment recharger la page ion après pop () dans ionic2

vous pouvez passer la page parent avec le nav push. de cette façon, vous pouvez accéder à la page mère en tant que navParamter.

dans la page parent:

 goToChildPage() {
    this.navCtrl.push(ChildPage, { "parentPage": this });
 }

et page enfant avant pop vous pouvez appeler des fonctions sur la page parent

this.navParams.get("parentPage").someFnToUpdateParent();
  //or
this.navParams.get("parentPage").someFnToRefreshParent();

ignorez les implémentations angulaires directes suggérées ici, d'autant plus que vous utilisez Ionic 2 et que les suggestions supposent Ionic 1. Ne commencez pas à mélanger trop de direct angular dans votre application ionique à moins qu'il n'y ait pas d'implémentation ionique pour ce dont vous avez besoin. Importez "Events" de ionic / angular2 à la fois à la Page1 et à la Page2, puis à la Page2 faites quelque chose comme

this.events.publish('reloadPage1');
this.nav.pop();

this.events.subscribe('reloadPage1',() => {
 this.nav.pop();
 this.nav.push(Page1);
});

Vous pouvez mettre en œuvre l'un de ces dans votre page:

ionviewwwillenter ionViewDidEnter

veuillez consulter la documentation sur le cycle de vie du navController et de la page: http://ionicframework.com/docs/v2/api/components/nav/NavController/

solution Simple qui a fonctionné pour moi a été d'obtenir de l'appel de la méthode de service de nouveau dans ionViewDidEnter

ionViewDidEnter() {
    this.loadGetService();
}

Vous pouvez envisager d'envoyer un événement avant d'appeler this.nav.pop pour la page 1 de se recharger.

PAGE 1:

import { Events } from 'ionic-angular'
constructor(public events:Events){
   this.listenEvents();
}
... ...
listenEvents(){
   this.events.subscribe('reloadDetails',() => {
    //call methods to refresh content
   });
}

PAGE 2:

import { Events } from 'ionic-angular'
constructor(public events:Events, public navCtrl:NavController){
}

function(){
   this.events.publish('reloadDetails');
   this.navCtrl.pop();
}

entrer le code ici

à la page2:

this.events.publish('reloadDetails');
this.navCtrl.pop();

à la page1:

this.events.subscribe('reloadDetails',() => {
    //call methods to refresh content
});

Qui fonctionne pour moi.

j'ai trouvé cette technique pour recharger une page:

this.navCtrl.insert(1, MyPage);
this.navCtrl.pop();

j'ai eu le même problème et passer de nombreuses heures à chercher et à essayer la solution.

Si je comprends bien, ton problème est:

Page 1 ont quelques reliures que vous obtenez d'une API / Webservice.

Page 2 ont quelques entrées et en appuyant sur le bouton Précédent (pop) vous voulez enregistrer des données + rafraîchir les fixations de la Page 1.

la façon dont je l'ai résolu a été la lecture d'un post sur StackOverflow que maintenant je ne peux pas trouver : (!!

La solution est d'utiliser un service Injectable.

PAGE 1:

/* IMPORTS */

import { App, Nav, NavParams } from 'ionic-angular';
import { Oportunidades } from '../../services/oportunidades.service';

/* SOME BINDINGS HERE */ 
{{oportunidades.mesActual.num_testdrive}}

/* CONSTRUCTOR */
  constructor(
    private oportunidades: Oportunidades, // my injectable service!
    public app: App,
    public nav: Nav,
    public params: NavParams
  ) {

// Call to the Injectable Service (named oportunidades):
    this.oportunidades.getOportunidades();
  }

INJECTABLE SERVICE:

/* IMPORTS */ 
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';

@Injectable()
export class Oportunidades {

  public url = 'http://your-API.URL';
  public data: Observable<Object>;
  public mesActual: Object = [];

  constructor(private http: Http){
    //GET API DATA
    this.data = http.get(this.url).map(res => res.json());
  }

  getOportunidades() {
    this.data.subscribe(data => {
      this.mesActual = new MesActual(
        data["mes_actual_slide"].num_testdrive,
        ...
        //Here I get the API data and set it on my injectable object
      );
    });
  }
}

PAGE 2:

/* SOME IMPORTS */
import { NavController } from 'ionic-angular';
import { UserData } from '../../services/data.service';
import { Oportunidades } from '../../services/oportunidades.service';
import { Http, Headers, URLSearchParams } from '@angular/http';

/* SOME example BINDINGS and INPUTS: */
@Component({
  template: `
  {{ day[selectedDay].dia }}
    Input data: 
    <ion-input type="number" clearOnEdit="true"
      #ventas id="ventas" value={{day[selectedDay].ventas}}
      (keyup)="setVal(ventas.value, $event)">
    </ion-input>
  `,
  providers: [
  ]
})

export class PageInsert {

  constructor(
    public navCtrl: NavController,
    private http: Http,
    private userData: UserData,
    public oportunidades: Oportunidades // my injectable service!
  ) {

    send(selectedDay){
      var url = 'http://your.api.url/senddata';

      // I SAVE data TO API / Webservice
      this.http.post(url, params, { headers: headers })
      .map(res => res.json())
      .subscribe(
        data => { 
          console.log(data); 
          // Here i'll call to the Injectable service so It refresh's the new data on Page1 
         // in my case, this send function is called when "pop" or "back" button of ionic2 is pressed
         // This means: On click on back button -> Save and refresh data of the Injectable that is binded with the Page1
          this.oportunidades.getOportunidades(); 
          return true; },
        error => { 
          console.error("Error saving!"); 
        }
       );
    }
}

j'espère que cela peut vous aider!! Demandez des problèmes similaires:)

je passe un FormGroup de Page-1 à Page-2. Je mets à jour les valeurs de FormGroup dans la Page-2. Quand je pop Page-2, le formulaire de Page-1 n'est pas mis à jour avec les nouvelles valeurs. Il n'a pas été à regarder pour les changements.

pour corriger cela, je patche le FormGroup avec lui-même après que la Page-2 a été activée mais toujours dans le composant Page-2.

Ceci est plus réactif, mais nécessite un appel à close().

// Page-2 close method
public close(): void {
    this.navCtrl.pop();
    this.formGroup.patchValue(this.formGroup.value);
}

tout cela est général, mais je vois le rafraîchissement sur la Page-1.

// Page-2 nav controller page event method
ionViewWillUnload() {
    this.formGroup.patchValue(this.formGroup.value);
}

dans certaines situations au lieu de pop() vous pouvez utiliser la fonction push (). Lorsque vous entrez la page avec la fonction push (), elle est rechargée. Vous pouvez également supprimer la page2 de la navigation.

 this.navCtrl.push(TabsPage).then(() => {
   const index = this.viewCtrl.index;
   this.navCtrl.remove(index);
   });

Ou si vous avez plus d'une page par exemple page1->page2->pag3:

this.navCtrl.push(TabsPage).then(() => {
const index = this.viewCtrl.index;
this.navCtrl.remove(index, 2); //this will remove page3 and page2
});

j'ai simplement charger les détails dans la page 1 dans une ionViewWillEnter fonction (en utilisant Ionique 2). Cela permet de gérer à la fois la charge initiale et tout rafraîchissement lors du retour à la page 1.

la Documentation est ici.

ionviewwwillenter

"S'exécute lorsque la page est sur le point d'entrer et devient la page active."

ionViewWillEnter() {
    this.refresh();
}

ionViewWillEnter sera appelé juste avant que vous (re)visualisiez la page