Function start when condition in ngIf becomes true in Angular 2

Question

Is there a way by which I can call the function immediately after the ngIf condition becomes true and the DOM is displayed accordingly?

Condition: click and ngif apply to different blocks

Answer 1

You can use getter / setter in a property trigger.

Using the following code, <div>And method doSomething()is executed as soon as you do this.trigger = true:

@Component({
  template: `<div *ngIf="trigger">I've been triggered</div>`
})
export class MyComp {
  private _trigger = false;

  get trigger() {
    return this._trigger;
  }

  set trigger(val) {
    this._trigger = val;
    this.doSomething();  // Call some method
  }

  doSomething() {
    // ...
  }
}