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
1
vote
2 answers

What is the correct contract for ngAfterContentInit and ngAfterContentChecked

I have created a demo project: https://stackblitz.com/edit/angular-e6pqlb?file=src%2Fcontent-host%2Fcontent-host.component.ts Please open above link and check console printed values to understand my point below. So, if you check src/main.html,…
1
vote
0 answers

How can I get untouched status change when click enter in a inputbox

Here is simple input box in a reactive form: Html:
TS: dosomething() { …
1
vote
1 answer

Is there a way to know if an image has been loaded in the dom on Angular

I'm actually working on Angular and I want to know if there is a way to know if an image has been loaded correctly in the dom. I trie using this.image.nativeElement.width but the width is sent before the image loading. HTML
1
vote
2 answers

Angular component - actualize data every time view is shown

I'm using ionic. I have a really basic question on actualizing data in component. I fetch data in components ngOnInit method over httpservice. This is only done once but it should be done every time this component is shown in view. What is the…
quma
  • 5,233
  • 26
  • 80
  • 146
1
vote
0 answers

How to refresh DOM after API response, without recreating the components in Angular?

I have JSON response for sport events in following format. [ { "game_id": 1, "team1": "Manchester United", "team2": "Chelsea", "sport_id": 1, "score": "1:1", "bets": [ { "bet": "1", …
Vladimir99
  • 65
  • 7
1
vote
2 answers

Listen to className changes on an element replaced by ng-content

I need to listen to class name changes on a element being replaced by the . I have tried many ways and the only way I found for this is by using setInterval which I think is not a good practice. Suppose I will inject an input element…
1
vote
0 answers

Angular problem material mat-tabs does not show scroll arrows

I am loading some mat-tabs dynamically via a promise, but the mat-tab does not show the arrows to move when necessary. but when clicking on a tap if they already show correctly My code looks like this import { CsmEmployerEntity } from…
1
vote
2 answers

Angular Lifecycle Interface OnChanges should be implemented for method ngOnChanges

Tslint is sending a warning indicating that OnChanges should be implemented for method ngOnChagnes lifecycle hooks. If I change ngOnChanges to OnChanges then the warning is not there. import { Component, Input, OnInit, Output, EventEmitter,…
1
vote
0 answers

prompt for a password on each tab change within the URI - Angular 7

I have a /admin URI and inside this there are 3 sub tabs Model Tracker
1
vote
1 answer

How to know WHEN a dynamically created Angular component is available to request in the DOM?

I dynamically create an Angular component like this (code is simplified, there are some missing parts) : [...] @ViewChild(MyDirective, { static: true }) myHost!: MyDirective; constructor( private readonly compiler: Compiler, private…
Yohan Dahmani
  • 1,670
  • 21
  • 33
1
vote
1 answer

Dynamically load external javascript file not working in angular 6

I am using Angular 6, am trying to add Bootstrap Multiselect in my project. But here am facing some issue bootstrap-multiselect.js not loading in page. So am tying to add dynamically add this bootstrap-multiselect.js file, but it is not loading…
1
vote
1 answer

How can I bind the template without calling fixture.detectChanges()?

I am fixing/adding unit tests to an existing application. Below is the patterns that the code follows. Methods call other methods. Unit tests use some mock classes. Calling fixture.detectChanges() is calling ngOnInit(), which calls all the rest of…
Richard77
  • 20,343
  • 46
  • 150
  • 252
1
vote
3 answers

Execute certain logic exactly after ngOnInit() in Angular 10

I'd like to execute some logic exactly after ngOnInit() because i want to decouple the logic from page rendering. I thought of Angular lifecycle hooks so i put the logic in ngAfterViewInit(), but seems it get called at the same time as…
Wayne Wei
  • 2,907
  • 2
  • 13
  • 19
1
vote
1 answer

How to change template when width of elementRef changed

I try to load some data in ngInit and set width of the div equal to received data. Then I try to set some style options in ngAfterViewInit using ViewChild and ElementRef, but my elementRef is always undefined. How can I fix it? MyComponent: export…
TryBetter
  • 43
  • 5
1
vote
0 answers

what is the meaning of "after Angular first displays the data-bound properties"

I'm following the Angular documentation about the ngOnInit lifecycle until it gets really confused by saying "after Angular first displays the data-bound properties". Btw, you can check the documentation here. I guess the meaning of the word display…
1 2
3
9 10