Bootstrap Carousel选项卡的角度路由导航问题

Question

我在页面上创建了4个选项卡，其中包含前一个和下一个元素，以遍历轮播项目。

每个标签都是不同的页面，因此每个标签都有不同的网址。单击“下一步”时，选项卡标题将更改为下一个选项卡，但URL不会更改。因此，更改选项卡时不会加载内容。同样适用于上一个。

我也使用<router-outlet>。单击“下一个”或“上一个”时，如何使标签生效？

这是我的代码

<div id="carouselId" class="carousel slide" data-ride="'carousel'" data-interval="false">

  <div class="carousel-inner nav-tabs" role="listbox">
    <div *ngFor="let tab of tabs; let i = index"
  class="carousel-item" routerLinkActive="active">
       <a id="activeHeader" class="nav-link" [routerLink]="[tab.tabRoute]">    {{tab.tabName}}</a>
    </div>
  </div>
</div>
    <a class="carousel-control" href="#carouselId" role="button" data-slide="prev"> 
     Previous
    </a>

    <a class="carousel-control" href="#carouselId" role="button" data-slide="next">
     Next
    </a>

<div>
    <router-outlet></router-outlet>
</div>