NgOnInit is not called when the injected class is initialized

Why is the call to ngOnInit() called when the Injectable class is Injectable ?

the code

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

Console exit

 FROM constructor() 
+174
javascript angular typescript
Jan 31 '16 at 5:33
source share
5 answers

Lifecycle hooks such as OnInit() work with directives and components. They do not work with other types, as a service in your case. From the docs:

The component has a life cycle managed by Angular itself. Angular creates it, displays, creates and displays its children, validates it when its data-related properties change, and destroys it before deleting it from the DOM.

Directives and component instances have a life cycle since Angular creates, updates, and destroys them.

+271
Jan 31 '16 at 5:49
source share

I don’t know about all ngOnDestroy life cycles, but as far as destruction is concerned, ngOnDestroy actually ngOnDestroy for ngOnDestroy when its provider is destroyed (for example, Injectable provided by the component).

From docs :

A lifecycle hook that is invoked when a directive, channel, or service is destroyed.

If anyone is interested in killing, check this question:

+44
Jan 23 '17 at 8:28
source share

Note: this answer applies only to corner components and directives, NOT to services.

I had the same problem when ngOnInit (and other lifecycle hooks) didn't ngOnInit my components, and most searches led me here.

The problem is that I used the syntax of the arrow function ( => ) as follows:

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

Obviously this does not work in Angular 6. Using function syntax without an arrow solves the problem:

 class MyComponent implements OnInit { public ngOnInit() { console.log("ngOnInit"); } } 
+3
May 29 '18 at 14:15
source share

Lifecycle methods for services are already covered by others, I share my ideas about lifecycle methods in general

Angular 4 life cycle methods

ngOnInit() , ngOnChanges() and ngOnDestroy() , etc. are life cycle methods. ngOnChanges() will be the first to be called before ngOnInit() , when the value of the associated property changes, it will NOT be called if there are no changes. ngOnDestroy() is called when a component is removed. To use it, OnDestroy must be an implement ed class.

0
Aug 14 '17 at 19:36 on
source share

In your service, you can use resolvers for the same purpose as described in this post: https://codeburst.io/understanding-resolvers-in-angular-736e9db71267

To understand the use of recognizers, let's see how a stream occurs when someone clicks on a link.

General routing route.

  • The user clicks on the link.
  • The angular load on the corresponding component.

Routing with Resolver

  • The user clicks on the link.

  • Angular executes specific code and returns a value or observable.

  • You can collect the returned value or observed in the constructor or in ngOnInit, in the class of your component that you are about to load.

  • Use the data collected for your purposes.

  • Now you can download your component.

Steps 2, 3, and 4 are performed using code called Resolver.

0
Aug 25 '19 at 7:59
source share



All Articles