简体   繁体   中英

Ionic2: Can't navigate from Page A to Page B but I can from Page A to C then B

Page A = Login;

Page B = Welcome;

Page C = List;

Offending Component = DefaultPopover;

So essentially I can't navigate from Page A to the Page B unless I remove a component from the welcome page or comment out the logout function from the DefaultPopover.

The same component works fine on Page C. If I navigate from Page A -> Page CI can then navigate to Page B fine. In the DefaultPopover if I change the logout to point to the WelcomeController everything works fine. I'm not sure what's going on.

I've included the controllers and my ionic info output below

Login Controller

import {ToastController, NavController, List} from 'ionic-angular/index';
import {WelcomeController} from '../index';
import {Component} from '@angular/core';
import {ListController} from '../content/short_form/list/list.controller';

@Component({
  templateUrl: 'build/pages/login/login.controller.html'
})
export class LoginController
{
  public username : string;
  public password : string;

  constructor(public toast : ToastController, public navCtrl: NavController)
  {
  }

  public checkAuth()
  {
    if (this.username !== 'test' && this.password !== 'test') {
      this.toast.create({
        showCloseButton : true,
        message : 'Username and password wrong',
        position : 'bottom',
        closeButtonText : 'Ok',
        dismissOnPageChange: true
      }).present();
    } else{
      this.navCtrl.setRoot(WelcomeController);
    }
  }
}

Welcome Controller

import {Component} from '@angular/core';
import {PopoverController} from 'ionic-angular/index';
import {DefaultPopover} from '../../components/popover/default/default.popover';

@Component({
  templateUrl : 'build/pages/welcome/welcome.controller.html'
})
export class WelcomeController
{

  constructor(public popoverCtrl : PopoverController)
  {
  }

  public presentPopover(event)
  {
    this.popoverCtrl.create(DefaultPopover, {}, {
      enableBackdropDismiss : true,
      showBackdrop : true
    }).present({
      ev : event
    });
  }
}

List Controller

import {Component} from '@angular/core';
import {
  ShortFormEntity,
  DetailsController
} from "../index";
import {ImageService} from "../../../../components/index";
import {NavController, PopoverController} from 'ionic-angular';
import {ShortFormService} from '../services/short_form.service';
import {DefaultPopover} from '../../../../components/popover/default/default.popover';

@Component({
  templateUrl : 'build/pages/content/short_form/list/list.controller.html',
  providers : [ShortFormService, ImageService]
})
export class ListController
{

  public list : [ShortFormEntity];
  private navCtrl : NavController;

  constructor(shortFormService : ShortFormService, navCtrl : NavController, public popoverCtrl: PopoverController)
  {
    this.list = shortFormService.shortForms;
    this.navCtrl = navCtrl
  }

  public createShortForm()
  {
    this.navCtrl.push(DetailsController);
  }

  public openShortForm(id)
  {
    this.navCtrl.push(DetailsController, {
      id : id
    })
  }

  public presentPopover(event)
  {
    this.popoverCtrl.create(DefaultPopover, {}, {
      enableBackdropDismiss : true,
      showBackdrop : true
    }).present({
      ev : event
    });
  }
}

DefaultPopover

import {Component} from '@angular/core';
import {ViewController, NavController} from 'ionic-angular/index';
import {LoginController} from '../../../pages/login/login.controller';

@Component({
  templateUrl : 'build/components/popover/default/default.popover.html'
})
export class DefaultPopover
{
  constructor(public viewCtrl : ViewController, public navCtrl : NavController)
  {
  }

  close()
  {
    this.viewCtrl.dismiss();
  }

  logout()
  {
    this.navCtrl.setRoot(LoginController);
  }
}

Ionic Info

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0
Ionic App Lib Version: 2.0.0-beta.20
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Mac OS X El Capitan
Node Version: v4.5.0
Xcode version: Xcode 7.2.1 Build version 7C1002

Edit:

To clarify @andreaspfr's question about the import. I have followed the angular2-seed paradigm and each directory has an index.ts file that imports all sub directories and ts files. To make importing a bit cleaner.

Where pages/index.ts looks like

export * from './content/index';
export * from './login/index';
export * from './welcome/index';

Are you sure that you're loading the WelcomePage correctly? In the Login.ts I can see that you integrate the WelcomePage like this import {WelcomeController} from '../index'; but in your Welcome.ts you load the template from your pages directory build/pages/welcome/welcome.controller.html . I guess it should be something like this ../pages/welcome

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM