【问题标题】:How to use angular 4 Router in an Ionic 3 project?如何在 Ionic 3 项目中使用 Angular 4 路由器?
【发布时间】:2017-04-05 07:56:48
【问题描述】:

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

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

我认为可以简单地使用角度路由器,但是在 ionic 3 中如何使用?

谢谢

【问题讨论】:

标签: angular routing ionic2


【解决方案1】:

首先,您在评论中引用了 ionic-native v3。但是, ionic-native 和 ionic 不是一回事。当您提出问题时,Ionic v3 尚未正式发布,因此除非您使用 beta 版本,否则我假设您仍在使用 v2。

URL 路径不需要 Angular 路由器。在 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 参数确保您仍有导航栏可以导航回上一页。

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

【讨论】:

  • 谢谢,但当我尝试重新加载页面时,仍然出现“ionic 无法 GET /”。
  • 因为你没有url重写
  • 有用的信息! (但不回答问题。)
猜你喜欢
  • 2019-09-11
  • 2018-01-15
  • 1970-01-01
  • 2019-06-15
  • 2020-02-17
  • 2019-08-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多