Difference between Constructor and ngOnInit in Angular

Overview of two Angular methods with code examples and explanations
30 August 2017   594

The Constructor is a default method of the class that is executed when the class is instantiated and ensures proper initialization of fields in the class and its subclasses. Angular or better DI analyzes the constructor parameters and when it creates a new instance by calling new MyClass() it tries to find providers that match the types of the constructor parameters, resolves them and passes them to the constructor like

new MyClass(someArg);

ngOnInit is a life cycle hook called by Angular2 to indicate that Angular is done creating the component.

We have to import OnInit in order to use like this (actually implementing OnInit is not mandatory but considered good practice):

import {Component, OnInit} from '@angular/core';

then to use the method of OnInit we have to implement in the class like this.

export class App implements OnInit{
  constructor(){
     //called first time before the ngOnInit()
  }

  ngOnInit(){
     //called after the constructor and called  after the first ngOnChanges() 
  }
}

Implement this interface to execute custom initialization logic after your directive's data-bound properties have been initialized. ngOnInit is called right after the directive's data-bound properties have been checked for the first time, and before any of its children have been checked. It is invoked only once when the directive is instantiated.

Mostly we use ngOnInit for all the initialization/declaration and avoid stuff to work in the constructor. The constructor should only be used to initialize class members but shouldn't do actual "work".

So you should use constructor() to setup Dependency Injection and not much else. ngOnInit() is better place to "start" - it's where/when components' bindings are resolved.

How to command robots with Angular?

Sebastian Witalec, Technical Evangelist for Progress/Telerik talks about NativeScript framework
17 October 2017   291

NativeScript is a free and open source JavaScript framework for building native iOS and Android apps. Add to that Angular with TypeScript and you will get a truly amazing combination. Then chip in some drones and robots with a BLE API and you are ready to rock.

But I know what you’re thinking: another way of building apps? What makes NativeScript special? Here are a few cool things:

  • Direct access to native APIs—no plugins required. Want to create a file on Android? Run new java.io.File()—in JavaScript!
  • Completely native performance through the use of a JavaScript bridge natively available on all three mobile platforms.
  • Cross-platform libraries for common use cases. Need to call a JSON API? Run http.getJSON
  • Style native apps using CSS. Yep, that’s actually a thing.

Speaker is Sebastian Witalec. He is a Technical Evangelist for Progress/Telerik with over 8 years of experience in software engineering and architecture. Sebastian has passion for all types of technologies. However in the last few years his focus shifted towards cross platform Mobile development where he gained experience with Apache Cordova and NativeScript. He is always happy to learn about the new stuff and to pass the knowledge as far as his voice (or the wire) can take him. Sebastian is based in London, UK actively working with various Dev communities in the area. When not acting techie he is a massive football fan/player (probably bigger at heart than skills).