angular - 如何在 IONIC 3 中使用路由

Question

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

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

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

我找到了类似的 question适用于 Ionic 2，但这是否也适用于 Ionic 3？

谁能详细说明一下？

Answer 1

查看此链接以了解 NavController 的详细信息 link .您必须将其导入当前的 ts 文件，然后是 =>

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

1) DeepLink

2) 组件导航栈

深度链接

深层链接导航就像网页导航一样，如下例所示 您必须使用@ionicpage 注释才能使用深度链接导航

https://locallhost:8000/#/HomePage/SecondPage

组件导航

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

有3个关键词push,pop,setRoot。

1. 设置根目录

   示例:

   this.navCtrl.setRoot(HomePage);

   (or)

   this.navCtrl.setRoot("HomePage"); //DeepLink navigation

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

2. 推送

   示例:

   this.navCtrl.push(SecondPage);

   (or)

   this.navCtrl.push("SecondPage"); //DeepLink navigation

   上面的例子有 push 关键字，其中导航堆栈在其堆栈中有一个组件，后面是主页。我的意思是，在主页组件之后，您将在导航堆栈 (HomePage/SecondPage) 中拥有第二页组件。

3. 流行

   示例:

   this.navCtrl.pop();

   (or)

   this.navCtrl.pop(); //DeepLink navigation

   假设你现在在第二页，想回到上一页，也就是主页。然后只需使用上面的示例，它就会从导航堆栈中弹出一个组件，并在导航堆栈中只为您提供主页组件。