使标题项充当链接

Question

我有此代码，我想在右键单击该标题时没有将标题项用作链接的选项。 这是我的代码。

      <button mat-button
    routerLink="/why-us"
    routerLinkActive="active">
    <span class="menu-button" translate>nav.why-us</span>
  </button>

  <button mat-button
    routerLink="/browse"
    routerLinkActive="active" class="marginCatalogButton">
    <span class="menu-button"  translate>nav.browse</span>
  </button>

（它们不允许右键单击并在另一个窗口中打开。）

我需要这样的东西：

Answer 1

将routerLink和routerLinkActive放在锚点内。我的网页中有此代码，并且可以正常工作

<a class="nav-item nav-link" routerLink="/article">ARTICLES</a>

编辑-提供我的网页的完整示例。

<nav class="navbar navbar-expand navbar-dark">
      <div class="navbar-nav mx-auto">
        <a class="nav-item nav-link" [routerLink]="['/coding']">DEVELOPING</a>
        <a class="nav-item nav-link" [routerLink]="['/fitness']">FITNESS</a>
        <a class="nav-item nav-link" [routerLink]="['/creativity']">CREATIVITY</a>
        <a class="nav-item nav-link" [routerLink]="['/home']" fragment="bgimg-5">ABOUT</a>
  </div>

Answer 2

尝试使用锚标记而不是跨度

<button mat-button
    routerLink="/why-us"
    routerLinkActive="active">
    <a class="menu-button" translate>nav.why-us</a>
  </button>

  <button mat-button
    routerLink="/browse"
    routerLinkActive="active" class="marginCatalogButton">
    <a class="menu-button"  translate>nav.browse</a>
  </button>