O'Reilly logo

Angular 2 Cookbook by Matt Frisbie

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Navigating with routerLinks

Navigating around a single page application is a fundamental task, and Angular offers you a built-in directive, routerLink, to accomplish this.

Note

The code, links, and a live example of this are available at http://ngcookbook.herokuapp.com/9983/.

Getting ready

Begin with the application setup assembled in the Setting up an application to support simple routes recipe.

Your goal is to add an additional route to this application accompanied by a component; also, you want to be able to navigate between them using links.

How to do it...

To begin, create another component, ArticleComponent, and an associated route:

[app/article/article.component.ts] import {Component} from '@angular/core'; @Component({ template: 'Article component!' ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required