Angular 7 Routing: The Basics

Routing in Angular in one of the most common implementations any angular application will need to make it usable. In this exercise we’ll break things down into simple building

10 months ago

Latest Post kubectl: most useful commands (a growing list) by Matthew Davis

Routing in Angular in one of the most common implementations any angular application will need to make it usable. In this exercise we’ll break things down into simple building blocks and get you routing a minutes!

We will cover the following topics:

app.module.ts

import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';

import {AppComponent} from './app.component';
import {HomeComponent} from './home/home.component';
import {ContactComponent} from './contact/contact.component';
import {MatButtonModule, MatToolbarModule} from '@angular/material';
import {RouterModule} from '@angular/router';

@NgModule({
    declarations: [

        AppComponent,
        HomeComponent,
        ContactComponent

    ],
    imports: [

        BrowserModule,

        MatToolbarModule,
        MatButtonModule,

        RouterModule.forRoot([

            {

                path: 'home',
                component: HomeComponent

            }, {

                path: 'contact',
                component: ContactComponent

            }

        ])

    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule {
}

Source Code

Matthew Davis

Published 10 months ago

Comments?

Leave us your opinion.