2017-12-29 10 views
0

Ich versuche, auf Knopfdruck zu einer anderen Seite zu navigieren.Ionic- this.NavCtrl.push() funktioniert nicht

Es gibt zwei Seiten zu Hause & Basis

in home.html <button ion-button click="onclick()"> Go</button>

in home.ts I BasePage Modul importiert haben.

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { BasePage } from '../base/base'; 
@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    constructor(public navCtrl: NavController) { 

    } 
onclick(){ 
    this.navCtrl.push(BasePage) 
} 
} 

in app.module.ts ich die gleiche Basepage

importiert haben

es dem page.neither nicht umleiten jeder Fehler auf der Konsole ist. Ich habe viele Seiten überprüft. Sie haben dieselbe Funktion verwendet, die korrekt funktioniert. Ich benutze angular3.

+0

ist BasePage lazy loaded? und du hast einen Tippfehler 'this.NavCtrl.push' muss es' this.navCtrl.push' sein –

+0

@SurajRao nein aus diesem Grund habe ich nur eine neue App erstellt. und überprüft. Trotzdem gibt es ein Problem. –

Antwort

1

Ihr Tastencode sieht nicht korrekt aus bzw. die click ist nicht gut formatiert und wird daher nicht korrekt behandelt, denke ich.

Statt

<button ion-button click="onclick()"> Go</button> 

Versuchen (klicken)

<button ion-button (click)="onclick()"> Go</button> 
0

Wenn Sie eine Funktion ausgelöst werden soll, wenn etwas passieren Sie haben Ereignisse zu verwenden. In Templates stehen die Ereignisse in Klammern. Das ist, was David Dal in Ihrem Code festlegt.

0

Es wäre besser, eine Klasseneigenschaft zu definieren, die die Seitenreferenz enthält. Versuchen Sie, in Ihrer .ts-Datei so etwas zu tun.

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { BasePage } from '../base/base'; 
@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    basePage: BasePage = BasePage; 

    constructor(public navCtrl: NavController) { 

    } 

    onclick(){ 
    this.navCtrl.push(this.basePage); 
    } 
} 

Auf diese Weise haben Sie die Seitenverweis in eine Eigenschaft. Verwenden Sie diese Eigenschaft als "Navigator".

Durch die Art und Weise versuchen, dies in HTML zu tun:

<button ion-button (click)="onclick()">Some Button</button> 

Auch sollten Sie Ihre Basepage zu App-Modul-Datei haben, hinzufügen oder es wird nicht funktionieren!

Hoffnung hilfreich zu sein;)

Beachten Sie, dass [navPush] Richtlinie, sondern direkt in der HTML-Taste zur Herstellung einer Funktion (wenn das gewünschte Ergebnis eine einfache Navigation erreichen nutzen könnten). In diesem Fall erstellen Sie einfach die Eigenschaft, wie ich zeige und in Ihrem HTML machen Sie diese < Schaltfläche ion-button [navPush] = "basePage"> Button Name </button> es funktioniert ohne Verwendung einer Funktion!