Ionic2:不能从页面A导航到页面B但我可以从页面A到C然后从B页面导航

时间:2016-09-30 14:34:19

标签: javascript angular ionic-framework ionic2

页面A =登录;

Page B =欢迎;

Page C = List;

Offending Component = DefaultPopover;

基本上我无法从页面A导航到页面B,除非我从欢迎页面中删除组件或从DefaultPopover注释掉注销功能。

相同的组件在第C页上正常工作。如果我从页面A导航 - > Page C然后我可以导航到Page B.在DefaultPopover中,如果我将注销更改为指向WelcomeController,一切正常。我不知道发生了什么。

我已将控制器和我的离子信息输出包含在

下面

登录控制器

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);
    }
  }
}

欢迎控制器

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
    });
  }
}

列表控制器

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);
  }
}

离子信息

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

编辑:

澄清@ andreaspfr关于导入的问题。我遵循angular2-seed范例,每个目录都有一个index.ts文件,用于导入所有子目录和ts文件。使导入更清洁。

pages / index.ts看起来像

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

1 个答案:

答案 0 :(得分:0)

您确定要正确加载WelcomePage吗?在Login.ts中,我可以看到您像这样import {WelcomeController} from '../index';集成了WelcomePage,但在您的Welcome.ts中,您从页面目录build/pages/welcome/welcome.controller.html加载模板。我想它应该是这样的../pages/welcome