当Injectable类被实例化时,不会调用ngOnInit

Lev*_*ler 175 javascript typescript angular

为什么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()');
    }

}
Run Code Online (Sandbox Code Playgroud)

控制台输出

FROM constructor()
Run Code Online (Sandbox Code Playgroud)

Sas*_*sxa 279

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

组件具有由Angular自己管理的生命周期.Angular创建它,渲染它,创建和渲染它的子节点,在数据绑定属性发生变化时对其进行检查并在将其从DOM中删除之前对其进行破坏.

指令和组件实例具有生命周期,因为Angular会创建,更新和销毁它们.

  • @LeviFuller是的,对于服务,您可以在构造函数中进行初始化,或者更好地创建init方法并从构造函数中调用它(以防您以后需要重置服务). (41认同)
  • 那么只需将我的`ngOnInit`逻辑移动到`Injectable`类的构造函数中?我只记得读过你出于某种原因应该保留构造函数之外的任何逻辑. (32认同)
  • 不完全是,[OnInit](https://angular.io/docs/ts/latest/api/core/OnInit-interface.html)与绑定有关.您希望等待输入值被解析时使用它,因为它们在构造函数中不可用.构造函数可以多次调用.例如,当您更改路径并加载不同的组件时,它们会被"构造"并且每次都被销毁...... (9认同)
  • 此处值得注意的是,Sevices _can_可以多次实例化,具体取决于您在`providers`数组中包含它们的位置.如果你想要一个单件服务,把它放在主模块的`providers`中,如果你想要每个组件服务,直接将它们添加到组件. (5认同)
  • 这并非完全不正确,因为@ SBD580在他的回答中指出,为注入服务调用了ngOnDestroy。 (4认同)

小智 47

我不知道所有的生命周期钩子,但是对于破坏,ngOnDestroy实际上在它的提供者被销毁时被调用Injectable(例如由组件提供的Injectable).

来自 docs :

销毁指令,管道或服务时调用的生命周期钩子.

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

  • 这样的可耻的ngOnInit不被称为:-(我真的很想做一些透明的延迟初始化魔术。如果可以调用ngOnDestroy,我不明白为什么init不能 (2认同)

Coc*_*ine 12

添加@Sasxa 的回答

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


AJ *_*son 5

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

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

问题是我使用的是箭头函数语法 ( =>),如下所示:

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

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

class MyComponent implements OnInit {
    public ngOnInit() {
        console.log("ngOnInit");
    }
}
Run Code Online (Sandbox Code Playgroud)

  • 可注入的类是服务,而不是组件。OP询问一项服务。尽管从语言角度来看您的答案可能是正确的,但它并没有回答这个问题。你应该删除它。 (3认同)
  • @AndrewPhilips,虽然我的用例与OP略有不同,但谷歌搜索“ngOnInit not called”会引导人们来到这里。我这个答案的目标不是帮助 OP,而是帮助其他 70,000 多名可能对“ngOnInit”有类似问题的观众。 (2认同)