Angular 6 ngOninit 没有被称为从孩子到父母答案

【问题标题】：Angular 6 ngOninit not called going from child to parentAngular 6 ngOninit 没有被称为从孩子到父母
【发布时间】：2019-02-08 23:44:49
【问题描述】：

考虑以下设置：

{ path: 'module1', component: Module1Component, children: [
    { path: 'component1', component: Component1Component, children: [
        { path: 'component2', component: Component2Component }
    ] }
] },

所以基于以上：

/module1 加载 Module1Component
/module1/component1 加载 Component1Component
/module1/component1/component2 加载 Component2Component

还有

Module1Component 是 Component1Component 的父级
Component1Component 是 Component2Component 的父级

Module1组件代码

import { Component, OnInit } from "@angular/core";

@Component({
    selector: 'app-module1-component',
    templateUrl: './module1.component.html',
    styleUrls: ['./module1.component.css']
})
export class Module1Component implements OnInit {

    constructor() {}

    ngOnInit() {
        console.log('Module1Component');
    }
}

Component1组件代码

import { Component, OnInit } from '@angular/core';

@Component({
    selector: 'app-component1',
    templateUrl: './component1.component.html',
    styleUrls: ['./component1.component.css']
})
export class Component1Component implements OnInit {

    constructor() { }

    ngOnInit() {
        console.log('Component1Component');
    }

}

Component2Component 代码

import { Component, OnInit } from '@angular/core';

@Component({
    selector: 'app-component2',
    templateUrl: './component2.component.html',
    styleUrls: ['./component2.component.css']
})
export class Component2Component implements OnInit {

    constructor() { }

    ngOnInit() {
        console.log('Component2Component');
    }

}

问题

鉴于这些链接：

<a [routerLink]="['/module1']">/module1</a>
<a [routerLink]="['/module1/component1']">/module1/component1</a>
<a [routerLink]="['/module1/component1/component2']">/module1/component1/component2</a>

当你在 /module1/component1/component2 并使用上面的 routerLink 转到 /module1/component1 时，Component1Component 的 ngOnInit 是未调用。
当您在 /module1/component1 并使用上面的 routerLink 转到 /module1 时，不会调用 Module1Component 的 ngOnInit.

结论：使用 routerLink 从子节点到父节点的 ngOnInit 没有被调用，为什么以及如何配置它？

注意：使用 router.navigate 或使用浏览器中的后退按钮时会发生相同的行为。

【问题讨论】：

标签： angular angular6

【解决方案1】：

当导航到具有不同参数的相同组件时，不调用 ngOnInit 是预期的行为。

但您不应该手动调用 ngOnInit。

每次路由参数更改时，订阅都会收到通知。所以订阅方法中的代码每次都会执行。你不需要调用 ngOnInit。

通过在 route.params.subscribe 中移动您的 console.log 来尝试。

【讨论】：