Angular read query string parameters

In this video we will discuss, how to read query string parameters in Angular Healthy diet is very important for both body and mind. We want to inspire you to cook and eat healthy. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking.    / @aarvikitchen5572   To read query parameters we use ActivatedRoute service. We use this same service to read required and optional route parameters. Text version of the video http://csharp-video-tutorials.blogspo... Slides http://csharp-video-tutorials.blogspo... Angular CRUD Tutorial    • Angular CRUD tutorial   Angular CRUD Tutorial Text Articles & Slides http://csharp-video-tutorials.blogspo... All Dot Net and SQL Server Tutorials in English https://www.youtube.com/user/kudvenka... All Dot Net and SQL Server Tutorials in Arabic    / kudvenkatarabic   Inject the ActivatedRoute service using the component class constructor constructor(private _route: ActivatedRoute) { } Depending on your project requirements, you can then use either the snapshot approach or the observable approach. We discussed the difference between these 2 approaches and when to use one over the other in Part 42 of this Angular CRUD tutorial. Part 42 - Subscribe to angular route parameter changes    • Subscribe to angular route parameter changes   In Angular there are 3 types of parameters. 1. Required parameters 2. Optional parameters 3. Query parameters When working with any of these parameters, the following properties and methods are very useful. Member Description has(name) Returns true if the parameter is present and false if not. Very useful to check for the existence of optional route and query parameters get(name) Returns the parameter value as a string if present, or null if not present in the map. Returns the first element if the parameter value is an array of values getAll(name) Returns a string array of the parameter value if found, or an empty array if the parameter is not present in the map. Use getAll when a single parameter could have multiple values keys Returns a string array of all the parameters in the map Please note : For required and optional route parameters, we use the paramMap property of the ActivatedRoute object and for Query Parameters, we use queryParamMap property. Use the snapshot approach if the query params does not change during the lifetime of this component. if (this._route.snapshot.queryParamMap.has('searchTerm')) { this.searchTerm = this._route.snapshot.queryParamMap.get('searchTerm'); } else { this.filteredEmployees = this.employees; } On the other hand, if you expect the query parameter value to change during the life time of this component, and if you want to react and execute some code in response to that change, then use the Observable approach. this._route.queryParamMap.subscribe((queryParams) =] { if (queryParams.has('searchTerm')) { this.searchTerm = queryParams.get('searchTerm'); } else { this.filteredEmployees = this.employees; } });