4
votes

La méthode push ion-nav ne fonctionne pas dans Ionic 4

prend en charge le push selon le document ici - https://ionicframework.com/docs/api/nav

My currentPage html (current-page.page.html) a un composant de bouton -

import { Component, OnInit } from '@angular/core';
import { NavController, NavParams } from '@ionic/angular';
import { NextPage } from '../next-page/next-page.page';

@Component({
  selector: 'current-page',
  templateUrl: './current-page.page.html',
  styleUrls: ['./current-page.page.scss'],
})
export class CurrentPage implements OnInit {

  constructor(public navCtrl: NavController, public navParams: NavParams) { }

  goToNextPage () {
    this.navCtrl.push('NextPage');
  }

  ngOnInit() {
  }

}

Mon fichier de script currentPage (current-page.page.ts) a le code suivant -

<ion-button (click)="goToNextPage()">Next Page</ion-button>

Cependant, j'obtiens l'erreur de format comme le fait Property 'push' n'existe pas sur le type 'NavController'

Je ne sais pas comment utiliser correctement la méthode push. Toute aide sera appréciée.

angular ionic-framework ionic4

2 commentaires

Comme décrit ici: ionicframework.com/docs/navigation/angular , Ionic 4 recommande d'utiliser le Routeur angulaire au lieu de leur propre NavController. Je pense qu'il sera plus facile et plus propre de mettre en œuvre cela au lieu d'utiliser le NavController.

Le composant Nav est utile pour charger des composants arbitraires et pousser de nouveaux composants sur la pile sans affecter le routeur global de l'application (document Ionic 4 - ionicframework.com/docs/api/nav ). Par exemple, modal ayant sa propre sous-navigation. J'utilise un routeur angulaire pour l'ensemble de mon application. Cependant, j'ai une diapositive dans le menu (volet partagé) qui a sa propre pile de pages.

4 Réponses :

0
votes

Vous pouvez peut-être utiliser this.navCtrl.navigateForward ('NextPage'); ?

0 commentaires

0
votes

Ionic 4, utilise le routage angulaire,

Cela fonctionnerait pour naviguer entre les pages

<ion-button color="primary" 
    routerLink="/nextPage" routerDirection="forward">Text Button</ion-button>

0 commentaires

2
votes

Donc, ion-nav n'est plus utilisé dans la même capacité que dans l'ionic 3.

Le cas d'utilisation dans Ionic 4 est pour "... les cas où vous pourriez avoir un modal, qui a besoin de son propre sous -navigation, mais pas le rendre lié à l'URL de l'application ".

La façon dont vous l'utilisez est:

ajoutez-le à votre modèle:

import { Component, ViewChild } from '@angular/core';
import { IonNav } from '@ionic/angular';
...
export class YourPage {

  @ViewChild('ionNav') ionNav:IonNav;
  ...

  ngAfterViewInit() {
    ... // after this hook and onwards you can call:
    this.ionNav.push("someComponent");
  }
}

1 commentaires

Pouvez-vous m'aider pour ce stackoverflow.com/questions/56058968/...

0
votes

Dans Ionic4, vous pouvez utiliser un NavController ionique ou un routeur angulaire. Si vous souhaitez utiliser le NavController ionique. Vous pouvez écrire comme ceci

import {
  NavController,
} from '@ionic/angular';

export class TrainerMessagesPage implements OnInit, OnDestroy {
  public _conversations: Conversation[] = [];
  public conversations: Conversation[] = [];
  private _amr: Subscription;
  public unreadOnly = false;

  constructor(
    private navCtrl: NavController,  ) {
  }

  public goToPage() {
    this.navCtrl.navigateForward(YOUR-Page-URL);
  }

}

0 commentaires