CODEWITHSUNDEEP
javascripthtmlangular
Muirik
Muirik

Reputation: 6289

Angular2 RouterLinking Working in One Place, Not Another

I have my routerLinks working in my Angular2 application. From my main drop-menu, when I click on the links, they load the correct URL and the correspondingly correct component. However, I have these same links listed in another part of the application, and for some reason they don't work there. I click on them and nothing happens - no URL change, and no loading of a component. The only difference between the working and non-working instance is that the non-working instance includes links attached to "li" items within a "ul". First I'll list the code that IS working:

 <div class="nav-menu-item indent"><a routerLink="about">About</a></div>
 <div class="nav-menu-item indent"><a routerLink="contact">Contact</a></div>

And here's the ul instance where they are NOT working:

<ul class="sublist">
   <li class="subitem"><a routerLink="about">About</a><span class="sub-item-count">68</span></li>
   <li class="subitem"><a routerLink="contact">Contact</a><span class="sub-item-count">56</span></li>
</ul>

Upvotes: 0

Views: 19

Answers (1)

Ben Richards
Ben Richards

Reputation: 3575

I think while your first component resolves those router links fine. The second one doesn't know what they are. Try this:

<ul class="sublist">
   <li class="subitem"><a routerLink="/about">About</a><span class="sub-item-count">68</span></li>
   <li class="subitem"><a routerLink="/contact">Contact</a><span class="sub-item-count">56</span></li>
</ul>

Upvotes: 1

Related Questions