Как добавить условный фрагмент со значением в тег HTML привязки в Angular 5

Question

Я загружаю меню из сервиса и мне нужно условно добавить фрагмент в якорь.здесь проблема заключается во фрагменте add # для пустого значения и не хотят добавлять # в URL для пустого фрагмента.

см. следующий HTML-код компонента navbar.

<ul class="nav navbar-nav">
    <li *ngFor="let menu of menus">
       <a [routerLink]="menu.menuUrl" [title]="menu.name" here need to add fragment with it's value if menu.fragment present>
          <span>{{menu.name}}</span>
       </a>
    </li>
</ul>

Answer 1

Что вы можете сделать, это использовать ngSwitch для отображения меню в соответствии со значением menu.fragment

<ul class="nav navbar-nav">
  <li *ngFor="let menu of menus" [ngSwitch]="menu.fragment !== undefined">
    <a *ngSwitchCase="true" [fragment]="menu.fragment" [routerLink]="menu.menuUrl" [title]="menu.name">
      <span>{{menu.name}}</span>
    </a>
    <a *ngSwitchDefault [routerLink]="menu.menuUrl" [title]="menu.name" >
      <span>{{menu.name}} no frag</span>
    </a>
  </li>
</ul>

Вы можете найти работающий пример https://stackblitz.com/edit/angular-fxp2dx