导航到推送通知有效负载上发送的路由 [英] Navigate to route sent on Push Notification Payload

问题描述

我有一个ionic2应用程序接收来自ionic.io的推送通知。在通知有效负载上，我正在发送要导航到的所需路由。

I have an ionic2 app receiving push notifications from ionic.io. On the notification payload I'm sending the desired route to be navigated to.

let route = notification.payload.route;

if (route) {
  that.navCtrl.push(route, notification.payload);
}

问题是有效载荷是一个字符串，而navCtrl是期待的接收路线值。与此导入中的 myPage 一样：

The problem is that the payload comes as a string, while the navCtrl is expecting to receive the route value. Like myPage from this import:

import { myPage } from '../pages.ts';

转换字符串的最佳方法是什么？或者如果有更好的方法可以做到这一点，请随时提及。谢谢。

What is the best way to convert the string? or if there is a better way to do this, feel free to mention that as well. Thank you.

推荐答案

如果导航选项有限，您可以使用开关将用户发送到页面，例如： / p>

If the navigation options are limited you could use a switch to send the user to the page, like:

let route = notification.payload.route;

if (route) {
  switch(route){
    case 'home':
      that.navCtrl.push(MyHomePage, notification.payload);
      break;

    case 'Users':
      that.navCtrl.push(MyUsersPage, notification.payload);
      break;

    case ...
  }
}

这不是最美丽的方式，但应该有效。

It's not the most beautiful way, but should work.

所以因为你想只使用包含页面选择器的字符串，我认为你能够做到这一点的唯一方法是使用延迟加载组件。

So since you want to just use a string containing the page selector i think the only way able for you to do this is using lazy loading components.

在开始之前，如果你的项目不在Ionic 3上，请按照 Changelog 步骤进行升级。

Before you start, if your project is not on Ionic 3, follow this Changelog steps to upgrade it.

1）您需要从 app.module.ts <$中删除要延迟加载的页面c $ c> entryComponents 和 declatarions ，当然还要删除页面导入。
所以从这个

1) You need to delete the pages you want to lazyload from your app.module.ts entryComponents and declatarions, also, of course, delete the page imports. So from this

import { HomePage } from '../pages/home';

@NgModule({
  declarations: [
    MyApp, HomePage
  ],
  imports: [
    ...
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp, HomePage
  ],
  providers: [
    ...
  ]
})

它看起来像这样：

@NgModule({
  declarations: [
    MyApp
  ],
  imports: [
    ...
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    ...
  ]
})

2）在每个延迟加载的文件夹中，你有3个文件，比如

2) On every lazy loaded folder you have 3 files, like

-home
|- home.html
|- home.scss
|- home.ts

你需要创建另一个文件， home.module.ts

And you need to create another file, a home.module.ts

3）在你的 home.module.ts 你需要这个代码

3) On your home.module.ts you'll need this code

import { NgModule } from '@angular/core';
import { HomePage } from './home';
import { IonicPageModule } from 'ionic-angular';

@NgModule({
    declarations: [HomePage],
    imports: [IonicPageModule.forChild(HomePage)],
})
export class HomePageModule { }

4）在你的 home.ts 你需要导入 IonicPage 装饰器并在 @Component 装饰器

4) On your home.ts you'll need to import IonicPage decorator and use it above your @Component decorator

import { IonicPage } from 'ionic-angular';

@IonicPage()
@Component({
    selector: 'home',
    templateUrl: 'home.html'
})

5）现在您已准备好使用延迟加载，您无需导入页面然后使用当你再次推送/弹出页面时，你需要将它作为一个字符串传递。
所以如果你使用 this.navCtrl.push（HomePage，data）; 现在你可以使用 this.navCtrl.push（'HomePage '，data）; 让深层链接为你处理。

5) Now you're ready to use lazy loading, you don't need to import the page and then use it when pushing/poping pages anymore, you need to pass it as a string. So if you used this.navCtrl.push(HomePage, data); now you can use this.navCtrl.push('HomePage', data); and let the deep linking take care of that for you.

如果您需要更多信息，请参阅延迟加载文档关于如何实现此功能，但据我所知，这是唯一的方法是你可以使用传递字符串值的路由。

If you neeed more information, see this lazy loading doc about how to implement this feature, but as far as i see this is the only way you can use routing with passing a string value.

希望这会有所帮助：）

这篇关于导航到推送通知有效负载上发送的路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！