* ngIf Angular4の問題

Question

私は最近導入された* ngifを使用できるコードブロックを作成しようとしていますが、警告がNoneの場合は「システムに警告がありません」と考えています。私が間違っていることを説明してください。どんなコメントも本当に役に立ちます。現在のコードで

<ul class="al-msg-center clearfix"> 
<li class="dropdown"> 
    <a href class="dropdown-toggle" id="msg-dd1" data-toggle="dropdown" aria-expanded="false"> 
     <i (click)="refreshAlerts()" class="fa fa-bell-o"></i> 
     <span *ngIf="alerts.length">{{alerts.length}} </span> 

     <div class="notification-ring"></div> 
    </a> 

    <div class="top-dropdown-menu dropdown-menu" aria-labelledby="msg-dd1"> 
     <i class="dropdown-arr"></i> 
     <div class="msg-list"> 
      <div *ngIf="alerts; else noAlerts"> 
       <a *ngFor="let msg of alerts" href class="clearfix"> 
        <div class="msg-area"> 
         <div>{{ msg.message }}</div> 
         <span>{{ msg.level }}</span> 
        </div> 
       </a> 
      </div> 
      <ng-template #noAlerts> 
       <div class="msg-area"> 
        <div>"The system has no alerts"</div> 
       </div> 
      </ng-template> 
     </div> 
    </div> 
</li> 

Answer 1

とすぐalertsが存在するとして、それはalerts配列が持っているどのくらいの要素を見ずにコンテンツを表示しようとします。

正確な結果を得るには、alerts.lengthにチェックする必要があります。

*ngIf="alerts?.length; else noAlerts"