实例化 Injectable 类时未调用 ngOnInit

IT技术 javascript angular typescript
2021-02-09 15:16:48

为什么ngOnInit()Injectable解决类调用

代码

import {Injectable, OnInit} from 'angular2/core';
import { RestApiService, RestRequest } from './rest-api.service';

@Injectable()
export class MovieDbService implements OnInit {

    constructor(private _movieDbRest: RestApiService){
        window.console.log('FROM constructor()');
    }

    ngOnInit() {
         window.console.log('FROM ngOnInit()');
    }

}

控制台输出

FROM constructor()
6个回答

生命周期钩子,就像OnInit()使用指令和组件一样。它们不适用于其他类型,例如您的服务。从文档:

组件具有由 Angular 本身管理的生命周期。Angular 创建它,渲染它,创建并渲染它的子节点,在它的数据绑定属性改变时检查它并在将它从 DOM 中删除之前销毁它。

指令和组件实例在 Angular 创建、更新和销毁它们时具有生命周期。

@LeviFuller 是的,对于服务,您可以在构造函数中进行初始化,或者更好地创建 init 方法并从构造函数调用它(以防您稍后需要重置服务)。
2021-03-15 15:16:48
这并非完全不正确,因为@SBD580 在他的回答中指出,ngOnDestroy被称为注入服务
2021-03-17 15:16:48
不完全是,OnInit与绑定有关。当您想等待输入值被解析时使用它,因为它们在构造函数中不可用。构造函数可以被多次调用。例如,当您更改路线并加载不同的组件时,它们每次都会“构造”并销毁......
2021-03-21 15:16:48
所以简单地将我的ngOnInit逻辑移到Injectable的构造函数中我只记得读过,无论出于何种原因,您都应该将任何逻辑排除在构造函数之外。
2021-03-27 15:16:48
这里还值得注意的是,服务可以多次实例化,具体取决于您将它们包含在providers数组中的位置。如果你想要一个单例服务,把它放在你的主module的 中providers,如果你想要每个组件的服务,直接将它们添加到组件中。
2021-04-12 15:16:48

我不知道所有的生命周期钩子,但至于销毁,ngOnDestroy当它的提供者被销毁时实际上会在 Injectable 上被调用(例如一个由组件提供的 Injectable)。

来自 docs :

当指令、管道或服务被销毁时调用的生命周期钩子

以防万一有人对破坏感兴趣,请检查这个问题:

这样的耻辱ngOnInit没有被调用:-(我真的很想做一些透明的延迟初始化魔术。如果ngOnDestroy可以调用我不明白为什么init不能
2021-03-17 15:16:48

添加@Sasxa 的回答

Injectables您可以class正常使用的情况下,将初始代码放入constructor而不是使用ngOnInit(),它工作正常。

一旦我的 dataService 被初始化,我就必须调用一个函数,相反,我在构造函数中调用了它,这对我有用。

注意:此答案仅适用于 Angular 组件和指令,不适用于服务。

ngOnInit(和其他生命周期钩子)没有为我的组件触发时,我遇到了同样的问题,并且大多数搜索将我带到这里。

问题是我使用了这样的箭头函数语法 ( =>):

class MyComponent implements OnInit {
    // Bad: do not use arrow function
    public ngOnInit = () => {
        console.log("ngOnInit");
    }
}

显然这在 Angular 6 中不起作用。使用非箭头函数语法解决了这个问题:

class MyComponent implements OnInit {
    public ngOnInit() {
        console.log("ngOnInit");
    }
}
@AndrewPhilips 虽然我的用例与 OP 的用例略有不同,但谷歌搜索“ngOnInit not called”会将人们带到这里。我对这个答案的目标不是帮助 OP,而是帮助其他 70,000 多名可能有类似ngOnInit.
2021-03-21 15:16:48
有道理 - 我编辑了我的答案,以明确表示这不适用于服务。
2021-03-21 15:16:48
很公平。我相信我已经看过 SO Q&A,其中作者提出并回答他们自己的问题。作为一个新的 Angular 程序员,两周前你的回答会让我感到困惑。从 SO 和 NG 的角度来看,我认为您的回答值得自己提出问题,因此没有删除而是“重新分类”。谁知道?也许它可能会覆盖更广泛的受众。干杯。
2021-03-29 15:16:48
可注入类是服务,而不是组件。OP 询问服务。尽管从语言 POV 来看您的答案可能是正确的,但它并没有回答这个问题。你应该删除它。
2021-04-07 15:16:48