4

在我的 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仅在我尝试离开组件后才被触发，这有什么意义。

请帮助我理解这一点。

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

4

1 回答 1

5

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

进口：

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

注入：

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

申请：

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

在这里找到。

于 2017-02-02T15:27:31.040 回答