如何在Ionic 3项目中使用angular 4路由器？

发布时间：2020-12-17 17:33:01 所属栏目：安全来源：网络整理

导读：我正在开发一个混合应用程序.使用离子导航路由器,它很容易在页面之间导航,但它不使用浏览器的“URL路径”. 我看到我们可以在ionicModule上指定我们的链接.每次在某处导航时都可以使用它来指定关联的路径,离子将在浏览器中更改它.但是,使用它,如果您刷新浏览

我正在开发一个混合应用程序.使用离子导航路由器,它很容易在页面之间导航,但它不使用浏览器的“URL路径”.

我看到我们可以在ionicModule上指定我们的链接.每次在某处导航时都可以使用它来指定关联的路径,离子将在浏览器中更改它.但是,使用它,如果您刷新浏览器,应用程序将丢失,您必须返回主页.

我认为可以简单地使用角度路由器,但是如何使用离子3？

谢谢

解决方法

首先,您在评论中引用了离子原生v3.然而,离子 – 天然和离子不是一回事.当您提出问题时,Ionic v3尚未正式发布,因此除非您使用测试版,否则我认为您仍然使用v2.

URL路径不需要角度路由器.在Ionic v2中,您可以这样做：

app.module.ts

export const deepLinkConfig: DeepLinkConfig = {
  links: [
    { component: Home,name: "home",segment: ""},{ component: DetailPage,name: "detail",segment: "event/:id",defaultHistory: [Home] }
  ]
};

然后将其包含在您的导入中：

IonicModule.forRoot(MyApp,{},deepLinkConfig)

您现在可以访问https://example.com/或https://example.com/event/1来访问应用页面.重新加载网站时,defaultHistory参数确保您仍然具有导航栏以导航回上一页.

在离子v3中,您可以使用IonicPage注释来配置路由：https://ionicframework.com/docs/nightly/api/navigation/IonicPage/

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!