Angular — Understanding Angular lifecycle hooks with a Sample Project
Understanding Component lifecycle hooks are very important for any successful Angular project.
Every component/directive undergo a lifecycle as Angular create, update and destroys them over time. Let’s discuss what are those, why and when we should use those with a sample project.
Angular provides eight interfaces to implement those as component goes from creation to destruction phases. Let’s understand these with the sample project.
- Sample Project
- Understand lifecycle methods order
- Lifecycle methods With Some Examples
- Summary
- Conclusion
Sample Project
Below is the sample project to demonstrate all these lifecycle hooks and other things in this article. Let’s clone and start the project!
git clone https://github.com/bbachi/angular-lifecycle-hooks.git// install dependencies
npm install// start the project
npm start
This is a TODO list App where you can add, edit and delete items. This is a very good example to understand all our angular lifecycle hooks.