Note: Msg has been edited to include working link of the code
Code: https://stackblitz.com/edit/angular-buyafd?file=src/app/peek-a-boo-parent.component.ts
The code above is from the official angular website.
The line 47, the tick method confuses me.
When I remove it, The following code in the template of the same component
<div> *ngFor = "let msg of hookLog" class = "log"> {{msg}} </div>
Only displays a single log message.
But when I do not remove it: The above code works correctly and displays all of the required messages in the logs.
**question: **
- I do not completely understand why the
tickfunction makes the template of the component behave properly (prints out all the logs, instead of just the first message in the log) .
[I have read the definition of the tick() function in the code and also read about the Event loop and how JS queues these things, but still I do not understand this.]
- My second question would be about the single log that gets printed **when
tick()function is removed **. I would like to know what is the mechanism behind the first log, which is the message :
**#1 name is not known at construction**
being printed.
Why did this particular message get chosen to get printed, and not the other ones that are also available in the hookLog?
Thank you.
**Link to documentation where code is present: **
https://angular.io/guide/lifecycle-hooks#lifecycle-example-set