RouterLink does not work

My routing in the angular2 apps works well. But i am going to make some routeLink based on this:

Here is my routing:

const routes: RouterConfig = [

    { path:'home' , component: FormComponent  },

    { path:'about', component: AboutComponent },

    { path:'**'   , component: FormComponent  }

];

And here is the links that i made:

<ul class="nav navbar-nav item">

                    <li>

                        <a routerLink='/home' routerLinkActive="active">Home</a>

                    </li>

                    <li>

                        <a routerLink='/about' routerLinkActive="active">About this</a>

                    </li>

</ul>

I expect that, when i click on them it navigates to the respected component, but they do not perform anything?

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

Can you please try [routerLink]='[/home']? What Angular2 version and router version are you using?

– Günter Zöchbauer
Aug 8 '16 at 15:15

it doesn't work. are u sure with the place of your qutations?? I think i am using the last version of angular2, but i don't know how to check it. I generated it with ng new. and it should be updated

– Kamyar Parastesh
Aug 8 '16 at 15:25

2

Sorry, should be [routerLink]="['/home']"

– Günter Zöchbauer
Aug 8 '16 at 15:25

2

Maybe you forgot to add directives: [ROUTER_DIRECTIVES], to your component's metadata. Without that, Angular won't know to parse the routerLinks.

– Mark Rajcok
Aug 8 '16 at 22:21

Possible duplicate of Angular2 Router link not working

– isherwood
Apr 19 '17 at 20:11

add a comment |

My routing in the angular2 apps works well. But i am going to make some routeLink based on this:

Here is my routing:

const routes: RouterConfig = [

    { path:'home' , component: FormComponent  },

    { path:'about', component: AboutComponent },

    { path:'**'   , component: FormComponent  }

];

And here is the links that i made:

<ul class="nav navbar-nav item">

                    <li>

                        <a routerLink='/home' routerLinkActive="active">Home</a>

                    </li>

                    <li>

                        <a routerLink='/about' routerLinkActive="active">About this</a>

                    </li>

</ul>

I expect that, when i click on them it navigates to the respected component, but they do not perform anything?

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

Can you please try [routerLink]='[/home']? What Angular2 version and router version are you using?

– Günter Zöchbauer
Aug 8 '16 at 15:15

it doesn't work. are u sure with the place of your qutations?? I think i am using the last version of angular2, but i don't know how to check it. I generated it with ng new. and it should be updated

– Kamyar Parastesh
Aug 8 '16 at 15:25

2

Sorry, should be [routerLink]="['/home']"

– Günter Zöchbauer
Aug 8 '16 at 15:25

2

Maybe you forgot to add directives: [ROUTER_DIRECTIVES], to your component's metadata. Without that, Angular won't know to parse the routerLinks.

– Mark Rajcok
Aug 8 '16 at 22:21

Possible duplicate of Angular2 Router link not working

– isherwood
Apr 19 '17 at 20:11

add a comment |

My routing in the angular2 apps works well. But i am going to make some routeLink based on this:

Here is my routing:

const routes: RouterConfig = [

    { path:'home' , component: FormComponent  },

    { path:'about', component: AboutComponent },

    { path:'**'   , component: FormComponent  }

];

And here is the links that i made:

<ul class="nav navbar-nav item">

                    <li>

                        <a routerLink='/home' routerLinkActive="active">Home</a>

                    </li>

                    <li>

                        <a routerLink='/about' routerLinkActive="active">About this</a>

                    </li>

</ul>

I expect that, when i click on them it navigates to the respected component, but they do not perform anything?

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

My routing in the angular2 apps works well. But i am going to make some routeLink based on this:

Here is my routing:

const routes: RouterConfig = [

    { path:'home' , component: FormComponent  },

    { path:'about', component: AboutComponent },

    { path:'**'   , component: FormComponent  }

];

And here is the links that i made:

<ul class="nav navbar-nav item">

                    <li>

                        <a routerLink='/home' routerLinkActive="active">Home</a>

                    </li>

                    <li>

                        <a routerLink='/about' routerLinkActive="active">About this</a>

                    </li>

</ul>

I expect that, when i click on them it navigates to the respected component, but they do not perform anything?

angular angular2-routing

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

asked Aug 8 '16 at 15:14

Kamyar Parastesh

1,419103666

Can you please try [routerLink]='[/home']? What Angular2 version and router version are you using?

– Günter Zöchbauer
Aug 8 '16 at 15:15

it doesn't work. are u sure with the place of your qutations?? I think i am using the last version of angular2, but i don't know how to check it. I generated it with ng new. and it should be updated

– Kamyar Parastesh
Aug 8 '16 at 15:25

2

Sorry, should be [routerLink]="['/home']"

– Günter Zöchbauer
Aug 8 '16 at 15:25

2

Maybe you forgot to add directives: [ROUTER_DIRECTIVES], to your component's metadata. Without that, Angular won't know to parse the routerLinks.

– Mark Rajcok
Aug 8 '16 at 22:21

Possible duplicate of Angular2 Router link not working

– isherwood
Apr 19 '17 at 20:11

add a comment |

Can you please try [routerLink]='[/home']? What Angular2 version and router version are you using?

– Günter Zöchbauer
Aug 8 '16 at 15:15

it doesn't work. are u sure with the place of your qutations?? I think i am using the last version of angular2, but i don't know how to check it. I generated it with ng new. and it should be updated

– Kamyar Parastesh
Aug 8 '16 at 15:25

2

Sorry, should be [routerLink]="['/home']"

– Günter Zöchbauer
Aug 8 '16 at 15:25

2

Maybe you forgot to add directives: [ROUTER_DIRECTIVES], to your component's metadata. Without that, Angular won't know to parse the routerLinks.

– Mark Rajcok
Aug 8 '16 at 22:21

Possible duplicate of Angular2 Router link not working

– isherwood
Apr 19 '17 at 20:11

Can you please try [routerLink]='[/home']? What Angular2 version and router version are you using?

– Günter Zöchbauer
Aug 8 '16 at 15:15

it doesn't work. are u sure with the place of your qutations?? I think i am using the last version of angular2, but i don't know how to check it. I generated it with ng new. and it should be updated

– Kamyar Parastesh
Aug 8 '16 at 15:25

Sorry, should be [routerLink]="['/home']"

– Günter Zöchbauer
Aug 8 '16 at 15:25

Maybe you forgot to add directives: [ROUTER_DIRECTIVES], to your component's metadata. Without that, Angular won't know to parse the routerLinks.

– Mark Rajcok
Aug 8 '16 at 22:21

Possible duplicate of Angular2 Router link not working

– isherwood
Apr 19 '17 at 20:11

add a comment |

5 Answers
5

active

oldest

votes

200

The code you are showing there is absolutely correct.

I suspect that your problem is that you are not importing RouterModule (which is where RouterLink is declared) into the module which uses this template.

I had a similar problem and it took me some time to solve as this step is not mentioned in the documentation.

So go to the module that declares the component with this template and add:

import { RouterModule } from '@angular/router';

then add it to your modules imports e.g.

@NgModule({

  imports: [

    CommonModule,

    RouterModule

  ],

  declarations: [MyTemplatesComponent]

})

export class MyTemplatesModule { }

Along with having the correct import statements, you'll also need a place for that routerLink to be shown, which is in the <router-outlet></router-outlet> element, so that also needs to be placed somewhere in your HTML markup so the router knows where to display that data.

edited Mar 7 '18 at 20:29

john_h

10015

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

thks friend this is help me

– Rafael Moura
Jan 14 '18 at 15:16

I thought so and yes - you are absolutely right in my case too!

– Dhananjay
Mar 23 '18 at 20:26

Good answer, really helped me.

– joydesigner
Jul 18 '18 at 1:36

Adding the Router module to my imports did the trick, thanks!

– Ndamulelo Nemakhavhani
Mar 20 at 20:33

add a comment |

don't forget this to add this below in your template:

<router-outlet></router-outlet>

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

answered May 11 '17 at 17:21

zai

12112

add a comment |

Try changing the links as below:

  <ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this</a>

    </li>

  </ul>

Also, add the following in the header of index.html:

<base href="/">

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

answered Nov 18 '16 at 21:44

raj_just123

5913

add a comment |

use it like this for mroe info read this topic

<a [routerLink]="['/about']">About this</a>

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

5

According to your link, his routerLink should work ;-)

– Günter Zöchbauer
Aug 8 '16 at 15:26

This works for "@angular/router": "~3.4.0" . Cheers!

– mikeym
Dec 27 '16 at 7:15

2

Yes, the bracket notation works (and is valid syntax with as specific purpose), but it's not a solution to this question.

– isherwood
Apr 19 '17 at 20:13

add a comment |

The links are wrong, you have to do this:

<ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this

        </a>

    </li>

</ul>

You can read this tutorial

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

Bracket notation serves a different purpose and does not solve this problem.

– isherwood
Apr 19 '17 at 20:14

this was it! <a [routerLink]="['/home']" routerLinkActive="active">Home</a> I was following the tutorial which had me put the routerLinkActive in the < li > tag. when I placed it in the < a tag it now works! Many thanks!!!! this is excellent!

– Rich P
Nov 21 '17 at 18:30

BTW, I do have all the other tags/suggested elements in place already. Now this feature works (sort of). I have to follow the rest of the tutorial because I notice that when I select other rows, even though the value for the selected row is being passed (I see it in the url) only the first row is being rendered. But that will be another topic. Many thanks again for this great help.

– Rich P
Nov 21 '17 at 18:36

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f38832851%2frouterlink-does-not-work%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

5 Answers
5

active

oldest

votes

5 Answers
5

active

oldest

votes

200

The code you are showing there is absolutely correct.

I suspect that your problem is that you are not importing RouterModule (which is where RouterLink is declared) into the module which uses this template.

I had a similar problem and it took me some time to solve as this step is not mentioned in the documentation.

So go to the module that declares the component with this template and add:

import { RouterModule } from '@angular/router';

then add it to your modules imports e.g.

@NgModule({

  imports: [

    CommonModule,

    RouterModule

  ],

  declarations: [MyTemplatesComponent]

})

export class MyTemplatesModule { }

edited Mar 7 '18 at 20:29

john_h

10015

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

thks friend this is help me

– Rafael Moura
Jan 14 '18 at 15:16

I thought so and yes - you are absolutely right in my case too!

– Dhananjay
Mar 23 '18 at 20:26

Good answer, really helped me.

– joydesigner
Jul 18 '18 at 1:36

Adding the Router module to my imports did the trick, thanks!

– Ndamulelo Nemakhavhani
Mar 20 at 20:33

add a comment |

200

The code you are showing there is absolutely correct.

I suspect that your problem is that you are not importing RouterModule (which is where RouterLink is declared) into the module which uses this template.

I had a similar problem and it took me some time to solve as this step is not mentioned in the documentation.

So go to the module that declares the component with this template and add:

import { RouterModule } from '@angular/router';

then add it to your modules imports e.g.

@NgModule({

  imports: [

    CommonModule,

    RouterModule

  ],

  declarations: [MyTemplatesComponent]

})

export class MyTemplatesModule { }

edited Mar 7 '18 at 20:29

john_h

10015

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

thks friend this is help me

– Rafael Moura
Jan 14 '18 at 15:16

I thought so and yes - you are absolutely right in my case too!

– Dhananjay
Mar 23 '18 at 20:26

Good answer, really helped me.

– joydesigner
Jul 18 '18 at 1:36

Adding the Router module to my imports did the trick, thanks!

– Ndamulelo Nemakhavhani
Mar 20 at 20:33

add a comment |

200

The code you are showing there is absolutely correct.

I suspect that your problem is that you are not importing RouterModule (which is where RouterLink is declared) into the module which uses this template.

I had a similar problem and it took me some time to solve as this step is not mentioned in the documentation.

So go to the module that declares the component with this template and add:

import { RouterModule } from '@angular/router';

then add it to your modules imports e.g.

@NgModule({

  imports: [

    CommonModule,

    RouterModule

  ],

  declarations: [MyTemplatesComponent]

})

export class MyTemplatesModule { }

edited Mar 7 '18 at 20:29

john_h

10015

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

The code you are showing there is absolutely correct.

I suspect that your problem is that you are not importing RouterModule (which is where RouterLink is declared) into the module which uses this template.

I had a similar problem and it took me some time to solve as this step is not mentioned in the documentation.

So go to the module that declares the component with this template and add:

import { RouterModule } from '@angular/router';

then add it to your modules imports e.g.

@NgModule({

  imports: [

    CommonModule,

    RouterModule

  ],

  declarations: [MyTemplatesComponent]

})

export class MyTemplatesModule { }

edited Mar 7 '18 at 20:29

john_h

10015

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

edited Mar 7 '18 at 20:29

john_h

10015

edited Mar 7 '18 at 20:29

john_h

10015

edited Mar 7 '18 at 20:29

john_h

10015

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

answered Nov 18 '16 at 13:56

Sam Redway

3,55911529

thks friend this is help me

– Rafael Moura
Jan 14 '18 at 15:16

I thought so and yes - you are absolutely right in my case too!

– Dhananjay
Mar 23 '18 at 20:26

Good answer, really helped me.

– joydesigner
Jul 18 '18 at 1:36

Adding the Router module to my imports did the trick, thanks!

– Ndamulelo Nemakhavhani
Mar 20 at 20:33

add a comment |

thks friend this is help me

– Rafael Moura
Jan 14 '18 at 15:16

I thought so and yes - you are absolutely right in my case too!

– Dhananjay
Mar 23 '18 at 20:26

Good answer, really helped me.

– joydesigner
Jul 18 '18 at 1:36

Adding the Router module to my imports did the trick, thanks!

– Ndamulelo Nemakhavhani
Mar 20 at 20:33

thks friend this is help me

– Rafael Moura
Jan 14 '18 at 15:16

I thought so and yes - you are absolutely right in my case too!

– Dhananjay
Mar 23 '18 at 20:26

Good answer, really helped me.

– joydesigner
Jul 18 '18 at 1:36

Adding the Router module to my imports did the trick, thanks!

– Ndamulelo Nemakhavhani
Mar 20 at 20:33

add a comment |

don't forget this to add this below in your template:

<router-outlet></router-outlet>

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

answered May 11 '17 at 17:21

zai

12112

add a comment |

don't forget this to add this below in your template:

<router-outlet></router-outlet>

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

answered May 11 '17 at 17:21

zai

12112

add a comment |

don't forget this to add this below in your template:

<router-outlet></router-outlet>

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

answered May 11 '17 at 17:21

zai

12112

don't forget this to add this below in your template:

<router-outlet></router-outlet>

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

answered May 11 '17 at 17:21

zai

12112

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

edited May 11 '17 at 17:22

Thomas Ayoub

23.2k1462107

answered May 11 '17 at 17:21

zai

12112

answered May 11 '17 at 17:21

zai

12112

answered May 11 '17 at 17:21

zai

12112

add a comment |

Try changing the links as below:

  <ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this</a>

    </li>

  </ul>

Also, add the following in the header of index.html:

<base href="/">

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

answered Nov 18 '16 at 21:44

raj_just123

5913

add a comment |

Try changing the links as below:

  <ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this</a>

    </li>

  </ul>

Also, add the following in the header of index.html:

<base href="/">

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

answered Nov 18 '16 at 21:44

raj_just123

5913

add a comment |

Try changing the links as below:

  <ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this</a>

    </li>

  </ul>

Also, add the following in the header of index.html:

<base href="/">

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

answered Nov 18 '16 at 21:44

raj_just123

5913

Try changing the links as below:

  <ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this</a>

    </li>

  </ul>

Also, add the following in the header of index.html:

<base href="/">

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

answered Nov 18 '16 at 21:44

raj_just123

5913

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

edited Apr 19 '17 at 20:13

isherwood

37.5k1082112

answered Nov 18 '16 at 21:44

raj_just123

5913

answered Nov 18 '16 at 21:44

raj_just123

5913

answered Nov 18 '16 at 21:44

raj_just123

5913

add a comment |

use it like this for mroe info read this topic

<a [routerLink]="['/about']">About this</a>

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

5

According to your link, his routerLink should work ;-)

– Günter Zöchbauer
Aug 8 '16 at 15:26

This works for "@angular/router": "~3.4.0" . Cheers!

– mikeym
Dec 27 '16 at 7:15

2

Yes, the bracket notation works (and is valid syntax with as specific purpose), but it's not a solution to this question.

– isherwood
Apr 19 '17 at 20:13

add a comment |

use it like this for mroe info read this topic

<a [routerLink]="['/about']">About this</a>

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

5

According to your link, his routerLink should work ;-)

– Günter Zöchbauer
Aug 8 '16 at 15:26

This works for "@angular/router": "~3.4.0" . Cheers!

– mikeym
Dec 27 '16 at 7:15

2

Yes, the bracket notation works (and is valid syntax with as specific purpose), but it's not a solution to this question.

– isherwood
Apr 19 '17 at 20:13

add a comment |

use it like this for mroe info read this topic

<a [routerLink]="['/about']">About this</a>

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

use it like this for mroe info read this topic

<a [routerLink]="['/about']">About this</a>

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

answered Aug 8 '16 at 15:15

rashfmnb

4,34632434

5

According to your link, his routerLink should work ;-)

– Günter Zöchbauer
Aug 8 '16 at 15:26

This works for "@angular/router": "~3.4.0" . Cheers!

– mikeym
Dec 27 '16 at 7:15

2

Yes, the bracket notation works (and is valid syntax with as specific purpose), but it's not a solution to this question.

– isherwood
Apr 19 '17 at 20:13

add a comment |

5

According to your link, his routerLink should work ;-)

– Günter Zöchbauer
Aug 8 '16 at 15:26

This works for "@angular/router": "~3.4.0" . Cheers!

– mikeym
Dec 27 '16 at 7:15

2

Yes, the bracket notation works (and is valid syntax with as specific purpose), but it's not a solution to this question.

– isherwood
Apr 19 '17 at 20:13

According to your link, his routerLink should work ;-)

– Günter Zöchbauer
Aug 8 '16 at 15:26

This works for "@angular/router": "~3.4.0" . Cheers!

– mikeym
Dec 27 '16 at 7:15

Yes, the bracket notation works (and is valid syntax with as specific purpose), but it's not a solution to this question.

– isherwood
Apr 19 '17 at 20:13

add a comment |

The links are wrong, you have to do this:

<ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this

        </a>

    </li>

</ul>

You can read this tutorial

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

Bracket notation serves a different purpose and does not solve this problem.

– isherwood
Apr 19 '17 at 20:14

this was it! <a [routerLink]="['/home']" routerLinkActive="active">Home</a> I was following the tutorial which had me put the routerLinkActive in the < li > tag. when I placed it in the < a tag it now works! Many thanks!!!! this is excellent!

– Rich P
Nov 21 '17 at 18:30

BTW, I do have all the other tags/suggested elements in place already. Now this feature works (sort of). I have to follow the rest of the tutorial because I notice that when I select other rows, even though the value for the selected row is being passed (I see it in the url) only the first row is being rendered. But that will be another topic. Many thanks again for this great help.

– Rich P
Nov 21 '17 at 18:36

add a comment |

The links are wrong, you have to do this:

<ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this

        </a>

    </li>

</ul>

You can read this tutorial

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

Bracket notation serves a different purpose and does not solve this problem.

– isherwood
Apr 19 '17 at 20:14

this was it! <a [routerLink]="['/home']" routerLinkActive="active">Home</a> I was following the tutorial which had me put the routerLinkActive in the < li > tag. when I placed it in the < a tag it now works! Many thanks!!!! this is excellent!

– Rich P
Nov 21 '17 at 18:30

BTW, I do have all the other tags/suggested elements in place already. Now this feature works (sort of). I have to follow the rest of the tutorial because I notice that when I select other rows, even though the value for the selected row is being passed (I see it in the url) only the first row is being rendered. But that will be another topic. Many thanks again for this great help.

– Rich P
Nov 21 '17 at 18:36

add a comment |

The links are wrong, you have to do this:

<ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this

        </a>

    </li>

</ul>

You can read this tutorial

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

The links are wrong, you have to do this:

<ul class="nav navbar-nav item">

    <li>

        <a [routerLink]="['/home']" routerLinkActive="active">Home</a>

    </li>

    <li>

        <a [routerLink]="['/about']" routerLinkActive="active">About this

        </a>

    </li>

</ul>

You can read this tutorial

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

edited Aug 8 '16 at 22:17

Mark Rajcok

296k92437462

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

answered Aug 8 '16 at 15:28

Fernando Del Olmo

1,0071031

Bracket notation serves a different purpose and does not solve this problem.

– isherwood
Apr 19 '17 at 20:14

this was it! <a [routerLink]="['/home']" routerLinkActive="active">Home</a> I was following the tutorial which had me put the routerLinkActive in the < li > tag. when I placed it in the < a tag it now works! Many thanks!!!! this is excellent!

– Rich P
Nov 21 '17 at 18:30

BTW, I do have all the other tags/suggested elements in place already. Now this feature works (sort of). I have to follow the rest of the tutorial because I notice that when I select other rows, even though the value for the selected row is being passed (I see it in the url) only the first row is being rendered. But that will be another topic. Many thanks again for this great help.

– Rich P
Nov 21 '17 at 18:36

add a comment |

Bracket notation serves a different purpose and does not solve this problem.

– isherwood
Apr 19 '17 at 20:14

this was it! <a [routerLink]="['/home']" routerLinkActive="active">Home</a> I was following the tutorial which had me put the routerLinkActive in the < li > tag. when I placed it in the < a tag it now works! Many thanks!!!! this is excellent!

– Rich P
Nov 21 '17 at 18:30

BTW, I do have all the other tags/suggested elements in place already. Now this feature works (sort of). I have to follow the rest of the tutorial because I notice that when I select other rows, even though the value for the selected row is being passed (I see it in the url) only the first row is being rendered. But that will be another topic. Many thanks again for this great help.

– Rich P
Nov 21 '17 at 18:36

Bracket notation serves a different purpose and does not solve this problem.

– isherwood
Apr 19 '17 at 20:14

this was it! <a [routerLink]="['/home']" routerLinkActive="active">Home</a> I was following the tutorial which had me put the routerLinkActive in the < li > tag. when I placed it in the < a tag it now works! Many thanks!!!! this is excellent!

– Rich P
Nov 21 '17 at 18:30

BTW, I do have all the other tags/suggested elements in place already. Now this feature works (sort of). I have to follow the rest of the tutorial because I notice that when I select other rows, even though the value for the selected row is being passed (I see it in the url) only the first row is being rendered. But that will be another topic. Many thanks again for this great help.

– Rich P
Nov 21 '17 at 18:36

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Ndtyjky