离子 navCtrl.setPages 在 app.component.ts 中不起作用答案

【问题标题】：Ionic navCtrl.setPages not working in app.component.ts离子 navCtrl.setPages 在 app.component.ts 中不起作用
【发布时间】：2019-01-17 23:50:00
【问题描述】：

在我的 app.component.ts 文件中，我有一个代码，如果用户点击 FCM 通知，该代码会将用户发送到不同的页面代码是这样的：

this.fcm.listenToNotifications().subscribe(async(notification) => {             
    if (notification.tap) {
        const pages = [
            {page: Page1},
            {page: Page1Subpage, params: {...}}
        ];
    this.navCtrl.setPages(pages);
    this.navCtrl.parent.select(1);
}

当我执行通知时，我在 Xcode 编辑器中看到以下错误：

2019-01-17 16:55:13.230990+0200 Adservio[2103:800067] ERROR: Unhandled Promise rejection: null is not an object (evaluating 'this.navCtrl.setPages') ; Zone: <root> ; Task: Promise.then ; Value: TypeError: null is not an object (evaluating 'this.navCtrl.setPages') http://localhost:8080/var/containers/Bundle/Application/9301607C-7904-4404-B00D-FE8D9E7EED17/Adservio.app/www/build/main.js:1:1380986

有人知道为什么吗？

【问题讨论】：

删除async，订阅已经为您处理了。

标签： angular ionic-framework ionic3

【解决方案1】：

这里是相关documentation：

如果您想从您的根应用程序组件控制导航怎么办？您不能注入 NavController，因为任何组件导航控制器是根组件的子组件，因此它们无法注入。

但你可以使用 Nav

import { Nav } from 'ionic-angular';

//....

export class MyApp {

@ViewChild(Nav) nav: Nav;

//...

//And inside your function 

//..

this.nav.push('Page1');

//..

【讨论】：

【解决方案2】：

在您的根组件中，您应该使用 Nav 而不是 NavController。在这里查看更多： https://ionicframework.com/docs/api/navigation/NavController/#navigating-from-the-root-component

您不能注入 NavController，因为作为导航控制器的任何组件都是根组件的子组件，因此它们不能被注入。

还要检查参考应用实现： https://github.com/ionic-team/ionic-conference-app/blob/v3/src/app/app.component.ts

【讨论】：