In this section, we are going to continue from the last section and will get started with Child Routes aka Nested Routes. Nested routes is the concept of containing routes within other routes. With nested routes we’re able to encapsulate the functionality of parent routes and have that functionality apply to the child routes. This is one of the nice ways to isolate different functional areas. Otherwise, imagine your base routes will grow like anything. I have configured the routes in such a way that all reviews now sit under location. Below, I have pasted modified structure of app.
In this section, we will continue from last post http://bit.ly/ng4-route-1, where we have introduced routing. In that post, although routes were working but there was no visual indication for the same. This is a simple change, basically CSS change. Let’s fix that first. Below is the snippet for the same.
Thought to share one small application built with Angular 4 CLI. Here, I was checking few Apple APIs. And then realized, since its a public API, hence something can be built around that using Angular 4. Therefore, built a little Angular App using that.
In this section, we will talk about about handling CORS issue with ASP.NET CORE and Angular 4 application. As part of Authentication, this app uses Windows Authentication. I have created app using ASP.NET Core 2 Angular template and then using the application. Application structure looks like
In this section, we will learn more about service injection. Before doing so, let’s create a new service. In the last section, we have understood different stages of ng-hooks. Now, if you have read that post closely, you would have observed one pattern that, I logged messages more often just to prove the point. This is quite repetitive. Therefore, these are the places where services fits in nicely. Main role of any service is to simplify the things. Here, you can think of one dedicated component doing the job. Hence, without wasting time, let’s get started.
In this section, we will talk about Angular Life Cycle hooks. Angular supports couple of life cycle hooks. Let’s take a closer look at that. In a nutshell, whenever any new component gets created, Angular goes to couple of different phases in this creation process. This also gives us opportunity to hook into different phases and utilize the same to its maximum. Below is the glimpse of ng-hooks in sequential order.