Search code examples
angulartypescriptprototypal-inheritance

Angular component inheritance. How parent's life cycle hooks can be executed?


So I have BaseComponent and many childs extends it:

export class Child1Component extends BaseComponent implements OnInit, AfterViewInit

Child1Component does not call super.ngAfterViewInit(), but for some reason BaseComponent AfterViewInit is executed. I just console it log:

ngAfterViewInit() {
  console.log('BaseComponent AfterViewInit')
}

How is that possible? What else except of super.ngAfterViewInit() can call parent's life cycle hook?

Could this be happening only in development mode?


Solution

  • I think it's normal OOP inheritance behaviour. If you don't explicitly define the ngAfterViewInit on the child component, then this component will have the the parent implementation of that method available.

    So, during components lifecycle, when angular checks wether the ngAfterViewInit method is available on the child component, then the answser is yes: the child component has that method implemented, but it's inherited from the parent component