Question

有没有办法在Angular应用程序的每一页上设置公共ngOnInit（）？而不是写在每一页：

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();
    }
 });
}

Angular ngOnInit适用于所有页面

2 个答案: