在移动视图中折叠导航栏-单击链接（角度8）

Question

在折叠导航栏中选择任何链接时，我希望它自动关闭并在没有导航栏的情况下刷新内容，但是会刷新整个页面

HTML代码：

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown"
          aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
          <i class="fa fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
          <ul class="navbar-nav ml-auto">
            <li class="nav-item ">
              <a class="nav-link" (click)="closeCollapse()" [routerLink]="['/link-one']">
                link one
              </a>
            </li>
            <li class="nav-item ">
              <a class="nav-link" (click)="closeCollapse()" [routerLink]="['/link-two']">
                link two
              </a>
            </li>
            <li class="nav-item">
              <a class="nav-link" (click)="closeCollapse()" [routerLink]="['/link-three']">
                link three
              </a>
            </li>
            <li class="nav-item">
              <a class="nav-link" (click)="closeCollapse()" [routerLink]="['/link-four']">
                link four
              </a>
            </li>
          </ul>
      </div>

TS代码：

navDropdown = this.el.nativeElement.querySelector('#navbarNavDropdown');
closeCollapse(){
this.navDropdown.classList.remove('show');
}

我尝试将data-toggle="collapse" data-target=".navbar-collapse.show"添加到每个导航链接，但合拢关闭而没有转到所选链接