Template parse errors:Parser Error: Unexpected token - RouterLink

Question

On the below error . Am getting template parse error on RouterLink .

What is the correct way to use the RouterLink in Angular 2 ?

      Unhandled Promise rejection: Template parse errors:Parser Error: Unexpected token / at column 2 in [[/events]] in ng:///t/e.html@30:46 ("r">
                 <ul class="nav nav-sidebar">
                    <li class="active"><a [ERROR ->][routerLink]="[/events]">Events</a></li>
                    <li><a [routerLink]="[/task"]>Tasks<"): ng:///t/e.html@30:46Parser Error: Unexpected token / at column 2 in [[/events]] in ng:///t/e.html@30:46 ("ebar">                     <ul class="nav nav-sidebar">
                    <li class="active">[ERROR ->]<a [routerLink]="[/events]">Events</a></li>
                    <li><a [routerLink]="[/task"]>Tas"): ng:///t/e.html@30:43, Directive tParser Error: Unexpected token / at column 2 in [[/events]] in ng:///t/e.html@30:46 ("ebar">
                 <ul class="nav nav-sidebar">

Head

Answer 1

You have syntax error, you're using:

<a [routerLink]="[/events]" ... >

but instead it should be:

<a [routerLink]="['/events']" ... >

or

<a routerLink="/events" ... >

Coulombe

Any idea on loading HTML files in webpack – Head

Answer 2

The syntax error the symbol / is not a string. Add quotes around the string to resolve error. [] is for array declaration (on the value), if you use it then add string value otherwise you don't need an array just use the attribute value which is string by default in HTML. You also don't need routerLink binding with [] in the resent verisons released by Angular.

So, the code simplifies to

<a routerLink="/events">Events</a> 

---

Naturopathy