ngIf асинхронная труба Ionic 3

Question

У меня есть этот код

 <div>
<div *ngIf="(imgDoc$ | async) ?.photoURL; then DisplayImgContainer;">
    <p>No Image</p>
</div>
<ng-template #DisplayImgContainer>
    <img [src]="(imgDoc$ | async) ?.photoURL"/> 
    Image Display 
</ng-template>

Но эта ошибка возвращается:

GET http://localhost:8100/null 404 (Not Found)

при переходе на этот код изображение обычно отображается:

<div>
  <img [src]="(imgDoc$ | async) ?.photoURL"/> 
</div>

Что не так с асинхронным вызовом * ngIf?

**

Я решил использовать этот код:

**

<div>
   <div *ngIf="imgDoc$ | async as item">
      <div *ngIf="item.photoURL; then noImgContainer;">
         <img [src]="item.photoURL"/> 
      </div>
      <ng-template #noImgContainer>
          Image Not Exists
      </ng-template>
  </div>
</div

Я нашел ответ в ответе этой темы: stackoverflow answer

Answer 1

Я решил использовать этот код:

   <div>
   <div *ngIf="imgDoc$ | async as item">
      <div *ngIf="item.photoURL; then noImgContainer;">
         <img [src]="item.photoURL"/> 
      </div>
      <ng-template #noImgContainer>
          Image Not Exists
      </ng-template>
  </div>
</div>

Я нашел ответ в ответе этой темы: ответ stackoverflow