question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

AoT compiled components do not call inherited lifecycle hooks

See original GitHub issue

I’m submitting a … (check one with “x”)

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior The AoT compiler does not look up the inheritance tree when checking for lifecycle hooks, which results in different behaviour than when compiling JiT.

Expected behavior

The AoT compiler should search all super classes of a component for implementation of lifecycle hooks.

Minimal reproduction of the problem with instructions

class BaseComponent implements OnInit {
  ngOnInit() {
    // do something important
  }
}

@Component( ... )
class ConcreteComponent extends BaseComponent {
  ...
}

When running in JiT mode, the ngOnInit() method will be called when the ConcreteComponent is instantiated. But in AoT mode, the function will not be called.

Currently, the workaround is to explicitly implement all the super class hooks:

@Component( ... )
class ConcreteComponent extends BaseComponent {
  ngOnInit() {
    super.ngOnInit();
  }
}

This is the case for all the lifecycle hooks, not just ngOnInit.

What is the motivation / use case for changing the behavior?

This is especially important for the @angular/upgrade/static library which has a base class, UpgradeComponent, for Angular 2 components that are used to upgrade Angular 1 components.

  • Angular version: <=2.2.0 (and master at time of writing)

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:1
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

7reactions
insidewhycommented, Dec 20, 2018

This is still an issue (tested in 4.3.6 and 4.1.1), I think this issue should be reopened unless it has been fixed in the 5 build?

Edit for those seeing this in the future: it seems to have been fixed from Angular 5.

1reaction
Nide83commented, Dec 18, 2018

@ohjames I’m pretty sure. The app works only with

ngOnInit(){
    super.ngOnInit();
}

or building without --prod

Read more comments on GitHub >

github_iconTop Results From Across the Web

angular aot doesn't execute lifecycle hooks from mixins classes
I'm using the following mixing from this post which gives my components access to a set of reusable methods, inlcuding calling upon the ......
Read more >
Lifecycle hooks - Angular
If your component has no inputs or you use it without providing any inputs, the framework will not call ngOnChanges() . ngOnInit(), Initialize...
Read more >
Here is what you need to know about dynamic components in ...
It means that ngDoCheck lifecycle hook is called. However, ngOnChanges are not triggered even if dynamically created component declares @Input and the parent...
Read more >
Top 40+ Angular Interview Questions and Answers (2023)
This file consequently calls the root component that is app-root. ... Native: The component does not inherit styles from the main HTML.
Read more >
Scripting restrictions - Unity - Manual
The AOT compiler does not recognize that it should generate code for the generic method OnMessage with a T of AnyEnum , so...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found