如何避免在 Angular 项目的引导选项卡中使用 routerlink？

如何解决如何避免在 Angular 项目的引导选项卡中使用 routerlink？

我正在尝试设置 HTML 引导程序选项卡，这是最基本的选项：

  <ul class="nav nav-tabs" id="myTab" role="tablist">
    <li class="nav-item">
      <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-selected="false">Contact</a>
    </li>
  </ul>
  <div class="tab-content" id="myTabContent">
    <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
    <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
    <div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">...</div>
  </div>

但是由于 angular 中的 routerlink，我被重定向到 https://localhost:5001/#profile 而不是我试图打开的 div。我不想关闭 routerlink 因为它是我网站的主要导航形式。我只是希望这个导航栏不要使用它。我一直无法找到解决这个问题的任何方法......希望有一个 html 解决方案，但对任何事情都持开放态度:)

解决方法

使用 routerLink 而不是 href。

参见角度 RouterLink。