所有页面通用的 Angular ngOnInit

Question

有没有办法设置通用 ngOnInit() 在 Angular 应用程序的每个页面上执行？ 而不是在每一页都写：

import { AppComponent } from '../app.component';

constructor(
    private app: AppComponent) {}

ngOnInit(): void {
    this.app.doCommonStuffForEachPage();
}

我想简单地写一次这段代码，当路由器打开每个页面时，this.app.doCommonStuffForEachPage() 会被调用。

Answer 1

虽然可能有一种很老套的方法来做到这一点，但它是糟糕的设计。所以我会说答案是否，至少在某种程度上这不是很好的做法。

如果所有组件都在全局范围内执行某项操作，那么它就像一个神奇的函数，被突然调用。遇到你的代码库的每个人都必须知道这个事实，否则奇怪的事情就会开始发生。另外，当你想要一个不有这种行为的组件时会发生什么？迟早会发生的。

您已经将行为封装在一个可注入类中的函数中，这使得它可以跨不同组件重用。这已经足够了。每次需要时自行调用。

不过，我真的无法想象需要这样做的情况。一个简单的 UI 按钮组件与将整个页面组合在一起的 AppComponent 有什么共同点？退后一步，想想你要解决的问题。每次初始化组件时自动调用函数是一个糟糕的解决方案。这就是为什么这是不可能的。

Answer 2

感谢 Shadowlauch，我想出了这个解决方案：

import { AppComponent } from '../app.component';
import { Router, NavigationEnd } from '@angular/router';

constructor(
    private app: AppComponent,
    private router: Router) {

 router.events.subscribe(event => {
    if (event instanceof NavigationEnd) {
        this.app.doCommonStuffForEachPage();
    }
 });
}