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

a year 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 a year ago

Comments?

Leave us your opinion.