nativescript - ngOnInit 直到我导航到另一个组件后才运行

在我的 NativeScript 应用程序中，我将路由设置为

export const routes = [
    { path: "",  component: AppComponent},
    { path: "home", component: HomeComponent},
    { path: "login", component: LoginComponent},
    { path: "news" , component: NewsComponent}
];

用户通过 firebase 登录后，用户会自动重定向到 HomeComponent 。我应该提到我有一个用户服务，它从 AppComponent Constuctor 中被触发，它确定用户是否已经登录，然后将他们重定向到登录或主页。

我将 console.log() 分布在整个组件中，以查看触发事件的时间，以便我可以尝试找出代码的放置位置。

import {Component, OnInit} from "@angular/core";
import {Page} from "ui/page";
import {RouterExtensions} from 'nativescript-angular/router';
import firebase = require("nativescript-plugin-firebase");

@Component ({
    selector : "home",
    templateUrl: "./pages/home/home.html",
    styleUrls: ["./pages/home/home.css"]
})
export class HomeComponent implements OnInit {

    private router;

    constructor(page: Page, router: RouterExtensions) {

        console.log("HOME CONSTRUCTOR TRIGGERED");
        page.actionBarHidden = false;
        this.router = router;
    }

    ngOnInit(){
        console.log("HOME NGONIT TRIGGERED");
    }

    goToNews(){
        this.router.navigate(["/news"]);
    }

}

在 home.html 我有一个触发 goToNews() 的按钮。当我加载应用程序时，我可以在控制台中看到 HomeComponent 构造函数被触发的时间，但我从未看到 ngOnInit 被触发。奇怪的是，当我单击按钮导航到 /news 时，这是我在控制台中看到 HomeComponent ngOnInit 触发的时候。这是它应该工作的方式吗？

这一切都归结为“大局理解”，我试图找出在加载 HomeComponent 时放置逻辑的最佳位置。我读到将它放在构造函数中是一个坏主意，将它放在 ngOnInit 中是理想的，但是如果 ngOnInit 仅在我尝试导航离开组件后才被触发，我看不出这有什么意义。

请帮助我理解这一点。

更新: 我在 ngOnInit 中向 AppComponent 添加了一个 console.log，当应用程序第一次加载时，它会被触发。因此，一定是服务中的导航导致 ngOnInit 无法在 HomeComponent 中触发。

最佳答案

尝试将 router.navigate() 放入单独的“区域”:

进口:

import { NgZone } from "@angular/core";

注入(inject):

constructor(private zone: NgZone) { ... }

申请:

this.zone.run(() => {
    this.router.navigate(["/news"]);
});

找到 here 。

关于nativescript - ngOnInit 直到我导航到另一个组件后才运行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39786307/