我目前正在尝试在Angular 6应用程序中实现Bootstrap选项卡导航。但是，我似乎无法使其正常工作。
我的代码如下：
ZoneId我尝试使用示例和Bootstrap文档中编写的DateTimeFormatter，但是由于某种原因，不是切换URL中的选项卡（即 <ul class="nav nav-pills nav-fill mb-3" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="nav-add-model1" data-toggle="pill" routerLink="." fragment ="tab-add-model1" role="tab" aria-controls="tab-add-model1" aria-selected="true">1</a>
</li>
<li class="nav-item">
<a class="nav-link" id="nav-add-model2" data-toggle="pill" routerLink="." fragment ="tab-add-model2" role="tab" aria-controls="tab-add-model2" aria-selected="false">2 </a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
<!--1st tab -->
<div class="tab-pane fade show active" id="tab-add-model1" role="tabpanel" aria-labelledby="nav-add-model1">
...
</div>
<!--2nd tab -->
<div class="tab-pane fade" id="tab-add-model2" role="tabpanel" aria-labelledby="nav-add-model2">
...
</div>
</div>
，而是切换到href="#tab-addmodelX"。 / p>
使用上面的代码，当我单击选项卡时，它将URL更改为root/addmodel#add-modelX)，但是选项卡从不切换，而是停留在默认的“ 1”选项卡中。