Should I instantiate an Observable from the constructor() or ngOnInit()?

Question

I know in general, one should instantiate instance variables and dependencies in the constructor, whether it is injected, new'ed up, or from a @ngrx/store select():

@Component
export class MyCoolComponent implements OnInit {
    public coolObservable$: Observable<any>;
    public myItems$: Observable<Item[]>;

    constructor(private myCoolService: CoolService, private store: Store) {
        // Instantiate the Observables here?
        this.coolObservable$ = Observable.of('cool!');
        this.myItems$ = this.store.select('items');
    }

    public ngOnInit() {
        // Or instantiate the Observables here?
        this.coolObservable$ = Observable.of('cool!');
        this.myItems$ = this.store.select('items'); 
    }
}

What is the best practice in Angular?

Please refer the link - [https://stackoverflow.com/a/35763811/7458082](https://stackoverflow.com/a/35763811/7458082) — Basavaraj Bhusani, Apr 12 '18 at 11:11
There is no 'best practice', there are practical considerations. Constructor is the place where class properties are supposed to be assigned (class fiends belong to constructor too, `public myItems$ = this.store.select('items')`). Is there a reason to do that in ngOnInit instead? Move the assignment to ngOnInit then. — Estus Flask, Apr 12 '18 at 11:14
This might provide you a clear understanding - https://blog.angularindepth.com/the-essential-difference-between-constructor-and-ngoninit-in-angular-c9930c209a42 — Sriram Jayaraman, Apr 12 '18 at 11:28
@BasavarajBhusani Yes, I have read that before, comes up as first result on Google Search. But it still leaves me unclear. I would say instantiating Observables is NOT work, and therefore should be in the `constructor`, however, many examples out there use `ngOnInit()` — Dolan, Apr 12 '18 at 12:29
@Dolan, If instantiating Observables have to be done in constructor of many components in the application, the project load would take longer time. Since the observables have to be created why the component instance to be created. So many developers suggest to do it in `ngOnInit`. In small applications creating Observables in constructor will not be a noticeable affect. but in big projects it will be. — Basavaraj Bhusani, Apr 12 '18 at 12:35

score 7 · Answer 1 · edited Nov 01 '19 at 09:14

ngOnInit() is used to make sure that the component's properties you use are already initialized. For example, in the following code invoking in the constructor getProductById() that returns an Observable would be wrong as the property productId would be undefined:

@Input() productId: number;

constructor(private productService: ProductService) {}         
ngOnInit() {           
  this.product = this.productService.getProductById(this.productId);
}

But in your case, you just initialize two variables in the constructor without using any component properties, so keeping this code in the constructor is fine.

Having said that, some purists would frown upon having any code in the constructor, but purists are not always right :).

Should I instantiate an Observable from the constructor() or ngOnInit()?

1 Answers1