Stack Overflow
Stack Overflow

Questions tagged [angular-lifecycle-hooks]

A component in Angular has a life-cycle, a number of different phases it goes through from birth to death. We can hook into those different phases to get some pretty fine grained control of our application.

To do this we add some specific methods to our component class which get called during each of these life-cycle phases, we call those methods hooks.

Reference

143 questions
1467
votes
27 answers

Difference between Constructor and ngOnInit

Angular provides life cycle hook ngOnInit by default. Why should ngOnInit be used, if we already have a constructor?
Haseena P A
  • 16,858
  • 4
  • 18
  • 35
182
votes
19 answers

Angular2 change detection: ngOnChanges not firing for nested object

I know I am not the first to ask about this, but I can't find an answer in the previous questions. I have this in one component
Simon H
  • 20,332
  • 14
  • 71
  • 128
24
votes
5 answers

How to call ngOnInit() again in Angular 2?

Please explain in this code, how to call ngOnInit() again when I call another method? ngOnInit(): void { this.route.params.subscribe((params: Params) => { this.model = this.userData; }); } update() { this.loading = true; …
Krunal
  • 938
  • 2
  • 10
  • 33
21
votes
5 answers

Ionic 4 : ngOnInit vs ionViewWillEnter

Which is better to use Angular Lifecycle Hook or Ionic Lifecycle hooks specially for initialization when creating a hybrid app using Ionic 4? Angular lifecycle hook - ngOnInit ngOnInit() { this.getData(); } Ionic lifecycle hook -…
Varun Sukheja
  • 6,170
  • 5
  • 51
  • 93
19
votes
4 answers

Angular2 -- ngAfterViewChecked is called many times..How to call a method just once after DOM is completely loaded?

I need to apply jquery plugin to radio buttons in Angular2 using Typescript. If I assign in ngAfterViewChecked, it is called many times and the control is refreshed multiple times. What is the alternate solution for calling the javascript method…
Kcs
  • 191
  • 1
  • 1
  • 4
17
votes
2 answers

What is the difference between ngOnInit(), ngAfterViewInit(), ngafterContentInit(), ngAfterViewChecked() and a constructor()?

What is the difference between ngOnInit(), ngAfterViewInit(), ngafterContentInit(), ngAfterViewChecked() and a constructor()? How do we implement them in the Angular 2? What are their purposes and usages? Where all will it be useful for…
Ashfaque Rifaye
  • 1,041
  • 3
  • 13
  • 22
9
votes
1 answer

Angular - HTTP Interceptor And Configuration loaded on APP_INITIALIZE

I have a configuration module with a factory that executes when the application is initialized (APP_INITIALIZER) export function ConfigFactory(config: ConfigService) { const res = () => config.load(); return res; } ... { provide:…
Sergio Daniel Coronel Malvarez
  • 327
  • 5
  • 17
8
votes
2 answers

How to initialize @Input?

I tried to do that like: @Input() data: any[] = []; Inside ngOnInit I see undefined: ngOnInit() { console.log(this.data); } So, below in code I get error, when I try to get length: return this.data.length; Because it is undefined. Why…
POV
  • 11,293
  • 34
  • 107
  • 201
6
votes
0 answers

How to delay "ngondestroy" hook calling while components destroy?

I want to delay ngOndestroy hook calling since I am facing one issue which is i have created angular application, in that I have used animation. sample - https://stackblitz.com/edit/angular-iribr7-zorjpc?file=app.component.html When I press toggl…
Kumaresan Sd
  • 1,399
  • 4
  • 16
  • 34
5
votes
1 answer

ngOnInit is not called on dynamic component

I'm using Angular 8 for a project, and I'm having trouble launching a dynamic component because ngOnInit doesn't get called. I've build a directive called PlaceholderDirective, shown below: @Directive({ selector: '[appPlaceholder]' }) export class…
codehero
  • 499
  • 3
  • 15
4
votes
1 answer

ngRouterOutlet and component lifecycle - problem with rendering custom template

Introduction I have created a shared table component that uses Angular Material to render a table based on data and column configurations. The component has default templates for string and number data types, but users should be able to provide…
akkonrad
  • 1,043
  • 1
  • 10
  • 25
4
votes
0 answers

Angular - Detect if stored components have been reattached or detached

I implemented a custom route strategy (more or less copied, see here) to cache already visited routes. Now I want to detect if a component inside a cached route has been reattached or detached. For example: I want to resume a video inside a…
JanMod
  • 364
  • 2
  • 9
4
votes
1 answer

Angular 2+ Window attribute undefined

I'm using an external library that attaches itself to the global window object (window['lib']) once the library's javascript file is loaded by the browser. I'm trying to invoke code using this library whenever a component is loaded, however…
ossys
  • 4,157
  • 5
  • 32
  • 35
3
votes
2 answers

Angular - avoiding setTimeout() hack to get div width

Wrote an Angular 13 component that draws something in a div whenever the window resizes. The problem is getting the rendered width of the div. If I do not use setTimeout() with a 170ms delay, this.treemap.nativeElement.offsetWidth is zero. As the…
nstuyvesant
  • 1,392
  • 2
  • 18
  • 43
3
votes
0 answers

How to run function after a component became visible in a Bootstrap modal dialog in Angular 8?

In my Angular project I have a select-box component, which get datas from my data models. Options coming from basically a service, the selected value coming from the current opened data model. I want to implement an add button near the select tag.…
netdjw
  • 5,419
  • 21
  • 88
  • 162
1
2 3
…
9 10