Question

我正在尝试构建一个应用程序，它具有以下工作流程。

LoginPage
主页
创建申请页面 - ＆gt;出现在主页和菜单
申请成功页面 - ＆gt;当请求创建成功时
请求列表页面 - ＆gt;出现在主页和菜单
请求明细页面 - ＆gt;点击请求项目

当用户提供正确的凭据时，从登录页面我正在呼叫服务。如果成功，我将主页作为导航控制器的根目录。

if(getLoginDetails.status == "success")
{
this.navCtrl.setRoot(HomePage);
}

但是当我在HomePage构造函数中使用this.navCtrl.length()时，它的显示2.当我刚从主页的LoginPage替换导航堆栈的根元素时，会发生这种情况。根据我的理解，计数应该是1。除登录外，每个页面都有swipeEnabled = true菜单和后退按钮。现在假设用户转到HomePage然后createRequestPage然后使用菜单转到requestListPage，现在我需要当用户点击后退按钮它应该将用户带到homePage。为此我的方法是当用户点击菜单时，我将删除所有导航堆栈中的页面，除了第一个是我们的根主页。我尝试过这种方式，但它不起作用 -

this.navCtrl.remove(1,this.navCtrl.length(),{}).then(
()=>{
      this.navCtrl.push(RequestListPage)
});

但这似乎不起作用。有人可以帮我这个。还有一些更好的离线控制器NavController的文档。

Answer 1

您的selector中是否设置了@Component代码？这是Ionic中的一个小错误，它会导致页面自动进入堆栈，这可以解释为什么长度为2以及为什么有后退按钮。

如果是这种情况，删除selector应该可以解决问题。

如果有人通过菜单，为什么不切换布尔值呢？然后只要推送到HomePage，如果该布尔为真。代码也更简单，也可能更干净。

Answer 2

如果你将navCtrl放在提供者中，那就是：

在提供者导入中

import { NavController, App } from 'ionic-angular';

在导出类init

中

private navCtrl: NavController;

构造函数中的

constructor(private app:App) {

   this.navCtrl = app.getActiveNav();

}

定义一个功能转到主页：

goToHomePage() {

    this.navCtrl.setRoot(HomePage);

}

现在可以在你喜欢的任何页面中调用this.navCtrl

import { YourProvider } from "../../your-provider";


@Component({

    selector: 'page',

    templateUrl: 'page.html',

    providers: [YourProvider]

})


export class YourPage{

  constructor(private yourProvider : YourProvider) {

}

goToHome() {
    this.yourProvider.goToHomePage();
}

现在您可以使用navCtrl

古德勒克

Ionic2 navController属性未按预期工作

2 个答案: