Angular – Step 4 – First component and Routing

Step 1 – Run the following commands from the console to create a component : –

> ng generate component home

Here, ‘home’ is the name of component.

Step 2 – Next, we need to visit /src/app/app-routing.module.ts and add the following code:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { HomeComponent } from './home/home.component'; // Add this


const routes: Routes = [
  { path: '', component: HomeComponent },              // Add this
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

The home component will load by default when the app loads.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.