Angular 6.でAPI呼び出しが行われるまでリンクを無効にしようとしています。getSelectedDealer()APIが返されるまでリンクを無効にしたいのですが。
<menu-link *ngIf="perms.has(perms.TOP_OFFERS) && _dealerPersistenceService.getSelectedDealer()"
route="/dynamic-journeys/{{getDealerId()}}/vehicles">
<menu-item><img src="/assets/menu-icons/top-offers.svg">Dynamic Journeys</menu-item>
</menu-link>
以下は、「a」タグコンポーネントとCSSのコードです。
<a [routerLink]="route" routerLinkActive="active" class="menu-link" [class.disabled]="disabled ? true: null">
<ng-content select="menu-item"></ng-content>
a.disabled {
pointer-events: none;
cursor: default;
}
基本的に、API呼び出しの前に「メニューリンク」項目を無効にし、後で有効にする必要があります。
Angularはディレクティブを選択的に適用する方法を必要としていますが、これが私の解決策です:
<a
(click)="markAsRead(notification);notification.externalUrl || $event.preventDefault()"
[href]="notification.externalUrl"
target="_blank""
...>