comment revenir à l'écran précédent ionique 2

Ionique, de q, nous allons utiliser $ionichistory.goback()pour revenir à l'écran précédent. Mais ionique dans les 2 comment pouvons-nous atteindre. Et j'ai essayé ce bouton à cliquer pour imprimer le message de la console . Mais sa ne fonctionne pas.

<ion-buttons left class="loginnavbtn" (click)="goback()">
  CANCEL
</ion-buttons>

.js

goback() {
   console.log('Click on button Test Console Log');
}

Merci de m'aider. j'ai deux écran . quand je vais d'abord l'écran à l'écran suivant. dans l'écran suivant, j'ai un bouton de retour. Quand je presse que je devrais être de retour au premier écran. comment donc ?

Mon code complet :

html:

<ion-header>
  <!-- use ion-toolbar for a normal toolbar and ion-navbar for navigation -->
  <ion-toolbar>
    <ion-buttons left class="loginnavbtn" (click)="goback()">

    CANCEL
    <!-- left aligned content here -->
    </ion-buttons>

    <ion-title>
      LOGIN
    </ion-title>

    <ion-buttons right class="loginnavbtn" (click)="loginbtntap()">
    SAVE
      <!-- left aligned content here -->
    </ion-buttons>
  </ion-toolbar>
</ion-header>
<ion-content>


   </ion-content>

mon .js :

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



@Component({
  selector: 'page-login',
  templateUrl: 'login.html'
})

export class LoginPage {


 goback() {
    this.navCtrl.pop();
}
loginbtntap() {
    this.navCtrl.pop();
}

  constructor(private navCtrl:NavController) {



  }

}

mon .scss:

page-login {
ion-header {
  .button-md {
    box-shadow: none;
  }

  .toolbar-title {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 500;
  }
}

.loginnavbtn {

  color: #116096 !important;
   font-size: 14px;
    font-weight: 400;
}
}
À venir cette page la méthode que vous utilisez ce.navCtrl.push(somepage) ou du présent.navCtrl.setRoot(somepage) ?

OriginalL'auteur hybrid Dev | 2017-04-29

  1. 13

    Vérifier NavController API dans les docs.

    Pour aller à la page précédente,injecter navcontroller dans le constructeur et l'appel pop().

    constructor(private navCtrl:NavController){}

goback() {
   this.navCtrl.pop();
   console.log('Click on button Test Console Log');
}

    Également vérifier la syntaxe pour bouton.

    <ion-buttons >
    <button ion-button left class="loginnavbtn" (click)="goback()">
      Cancel
    </button>
    <!-- left aligned content here -->
    </ion-buttons>
    j'ai essayé, mais sa ne fonctionne pas
    ne fonctionne pas sens? avez-vous des erreurs? tous les journaux dans la console?
    pas de messages du journal. j'ai mis mon code dans mon post.je ne sais pas ce que je suis absent
    j'ai vérifier les problèmes est dans ma personnalisé scss code. j'ai écrit que scss code pour rendre le titre de centre . mais maintenant, que faire de problème.
    Vous pouvez aussi ajouter navPop dans l'élément de bouton comme ceci <button ion-button left class="loginnavbtn" navPop>

    OriginalL'auteur Suraj Rao

  2. 4

    La navigation dans Ionique fonctionne comme:

    1. POUSSEZ la Page:

    pageone.ts

    import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { PageTwo }from '../pagetwo/pagetwo';

@Component({
  templateUrl: 'pageone.html'
})
export class PageOne {
  constructor(public navCtrl: NavController) {}

  push() {
    this.navCtrl.push(PageTwo);
  }
}

    pageone.html

    <ion-header>
  <ion-navbar>
    <ion-title>Navigation</ion-title>
  </ion-navbar>
</ion-header>
<ion-content padding>
  <button ion-button block (click)="push()">Push New Page</button>
</ion-content>

    2.POP Page:

    pagetwo.ts

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

@Component({
  templateUrl: 'pagetwo.html'
})
export class PageTwo {

  constructor(public navCtrl: NavController) {}

  pop() {
    this.navCtrl.pop();
  }
}

    pagetwo.html

    <ion-header>
  <ion-navbar>
    <ion-title>Page 2</ion-title>
  </ion-navbar>
</ion-header>
<ion-content padding>
  <button ion-button color="secondary" block (click)="pop()">Pop This         
Page</button>
</ion-content>

    OriginalL'auteur Jayaprakash G