如何在IONIC 3中使用路由

Question

我正在开发Ionic 3应用程序。现在，我NavController用于路由和切换页面。

例如： this.navCtrl.push(DetailsPage);

但是我现在需要使用Angular路由。

我为Ionic 2 找到了类似的问题，但是在Ionic 3中也可以使用吗？

有人可以详细说明吗？

Answer 1

检查此链接以获取NavController 链接的详细信息。您必须将其导入到当前的ts文件中，然后==

我们可以在离子中使用两种导航方式

1）深度链接

2）组件导航堆栈

深度链接

Deeplink导航的行为类似于网页导航，如以下示例所示，您必须使用@ionicpage批注才能使用Deeplink导航

https：// locallhost：8000 /＃/ HomePage / SecondPage

组件导航

您必须在受尊重的ts文件中导入组件才能导航

有三个关键词：push，pop，setRoot。

1. setRoot

   范例：

   this.navCtrl.setRoot（HomePage）;

   （要么）

   this.navCtrl.setRoot（“ HomePage”）; // DeepLink导航

   用于将组件作为根页面，换句话说，它将创建一个空的导航堆栈，其中主页是根。

2. 推

   例：

   this.navCtrl.push（SecondPage）;

   （要么）

   this.navCtrl.push（“ SecondPage”）; // DeepLink导航

   上面的示例具有push关键字，其中导航堆栈的堆栈中有一个组件，其后是Homepage。我的意思是，在首页组件之后，您将在导航堆栈（HomePage / SecondPage）中拥有第二页组件。

3. 流行音乐

   例：

   this.navCtrl.pop（）;

   （要么）

   this.navCtrl.pop（）; // DeepLink导航

   假设您现在在第二页，并且想返回到上一页即主页。然后，仅使用上面的示例，它将从导航堆栈中弹出一个组件，并仅向您提供导航堆栈中的主页组件。