2017-01-27 5 views
0

Я использую угловую маршрутизацию 2 в своем тестовом проекте. Уже создан routing.ts и импортирован его в Module.ts.Угловое поведение 2 Маршрутизация

В моей app.component.html (что шаблон HTML файл для app.component.ts) У меня есть следующий код:

<div class="navbar navbar-inverse navbar-fixed-top"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a href="#" class="navbar-brand">Application name</a> 
     </div> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
       <li><a href="#">Home</a></li> 
       <li><a href="#">API</a></li> 
       <li><a routerLink="en/test" routerLinkActive="active">Test1</a></li> 
      </ul> 
     </div> 
    </div> 
</div> 
<div class="container body-content"> 
    Something 
    <hr /> 

    <div> 
     <a routerLink="en/test" routerLinkActive="active">Test2</a> 
    </div> 

    <router-outlet></router-outlet> 
    <footer> 
     <p>&copy; 2017 - My ASP.NET Application</p> 
    </footer> 
</div> 

Однако, когда я запускаю приложение, Test1 генерирует следующий <a> тега :

Test1:

<a routerlink="en/test" routerlinkactive="active" ng-reflect-router-link="en/test" ng-reflect-router-link-active="active" ng-reflect-href="/en/home/en/test" href="/en/home/en/test">Test1</a> 

и Test2:

<a routerlink="en/test" routerlinkactive="active" ng-reflect-router-link="en/test" ng-reflect-router-link-active="active" ng-reflect-href="/en/test" href="/en/test">Test2</a> 

Как вы можете видеть, разница между ng-reflect-href и href атрибутами. Test1: ng-reflect-href="/en/home/en/test" href="/en/home/en/test" test2: ng-reflect-href="/en/test" href="/en/test"

Мой вопрос: Почему это происходит?

ответ

0

Хорошо, я это исправил, добавив / в routerLink, прежде чем "en/test" Это как это сейчас:

<li><a routerLink="/en/test" routerLinkActive="active">Test1</a></li>