Links for routing in Angular
In previous lessons we typed URLs into the address bar manually. Now let's make links that will show different components when clicked.
To do this, we'll do the links in a special way. The thing is, we don't want a real click on the links. We just want Angular to show another component, change the URL in the browser's address bar, and not refresh the page.
Therefore, instead of the native href attribute, we will use the Angular RouterLink attribute.
To do this, we need to import it:
import { RouterLink } from '@angular/router';
Write in the decorator:
@Component({
......
imports: [RouterOutlet, RouterLink],
......
})
Now we can make our links:
<nav>
<a routerLink="/aaaa/">
Aaaa
</a>
<a routerLink="/bbbb/">
Bbbb
</a>
</nav>
Make links that switch your components.
