特定页面上的Ionic 3导航

Question

场景：

我有四个组件，如下图所示。 chatbot组件具有navController。如果我使用this.navCtrl.push(ComponentD);，则整个页面都充满了组件D。

要求：

当我在聊天机器人组件内部使用this.navCtrl.push(ComponentD);时，应将组件D推到组件C的位置，其余组件不应消失。

我该怎么做。任何线索都将有所帮助。谢谢。

Answer 1

您在哪里执行此代码？ NavCtrl是通过角度自动注入的。注入器服务会找到最接近的NavCtrl。因此，它不会总是以相同的方式表现。这取决于您在哪里运行代码。您可以发布正在做this.navCtrl.push(ComponentD);的上下文吗？另一种方法是通过进行this.app.getActiveNavs()寻找合适的NavCtrl。

Answer 2

您的应用程序组件模板应如下所示：

<component-a></component-a>
<component-b></component-b>
<ion-nav [root]="component-c" #content></ion-nav>

在ion-nav组件内部，显示其他页面。