ブートストラップのドロップダウン - メニュー項目の表示プロパティの変更

Question

角度の付いたブートストラップメニューを使用しています。私はいくつかのメニュー項目を表示し、表示プロパティを使用して非表示にしたいと思います。クラスhidden_​​itemはdisplay：noneと定義されています。ユーザーがログインすると、「メッセージ」メニュー項目が表示されますが、それをクリックすると受信トレイおよび送信済みリンクは表示されません。後でページを更新すると、すべてが正常に動作し、受信トレイと送信トレイが表示されます。ページをリフレッシュせずに動作させるにはどうすればよいですか？

   <li [ngClass]="isLoggedIn() ? 'dropdown' : 'hidden_item'"> 
        <a [routerLink]="['Mailbox', {'boxname': 'inbox'}]" class="dropdown-toggle">Messages <span class="nav-up-carret"></span></a> 
        <ul class="dropdown-menu" role="menu"> 
         <li><a [routerLink]="['Mailbox', {'boxname': 'inbox'}]">Inbox</a> </li> 
         <li><a [routerLink]="['Mailbox', {'boxname': 'sent'}]">Sent</a></li> 
        </ul> 
       </li> 

Answer 1

あなたは* ngIfを使用し、それをこのように試すことができます：それはtrueを返す場合isLogedIn()リターンがfalseが、それを追加する場合

li *ngIf="isLogedIn()"> 
     <a [routerLink]="['Mailbox', {'boxname': 'inbox'}]" class="dropdown-toggle">Messages <span class="nav-up-carret"></span> 
     </a> 
      <ul class="dropdown-menu" role="menu"> 
        <li><a [routerLink]="['Mailbox', {'boxname': 'inbox'}]">Inbox</a> </li> 
        <li><a [routerLink]="['Mailbox', {'boxname': 'sent'}]">Sent</a></li> 
      </ul> 
</li> 

この方法では、角度を自動的DOMからブロックを削除します。

Answer 2

あなたの問題を正しく理解していれば、メッセージのアンカー要素にdata-toggle="dropdown"というプロパティがありません。

それは

<li [ngClass]="isLogedIn() ? 'dropdown' : 'hidden_item'"> 
        <a [routerLink]="['Mailbox', {'boxname': 'inbox'}]" class="dropdown-toggle" data-toggle="dropdown">Messages <span class="nav-up-carret"></span></a> 
        <ul class="dropdown-menu" role="menu"> 
         <li><a [routerLink]="['Mailbox', {'boxname': 'inbox'}]">Inbox</a> </li> 
         <li><a [routerLink]="['Mailbox', {'boxname': 'sent'}]">Sent</a></li> 
        </ul> 
       </li>