Angular 6 @input меняет свои значения, и просмотр слишком медленный для обнаружения

Question

У меня есть компонент, который получает свои значения из http-запроса каждые 3 секунды и передает эти значения дочернему компоненту как @input.Каждый раз, когда ввод имеет новые значения, вид дочернего компонента мигает.Таким образом, я получил дочерний компонент каждые 3 секунды мигает (показывает пустые значения), а затем сразу же показывает правильное значение.Любое решение, чтобы остановить это мигание?

Я устал наPushStrategy, но не могу решить это

Компонент

div class="patient-box" *ngIf = "model" >
<div class="patient-name">
  {{model?.firstName}} {{model?.lastName}}
  <div *ngIf="model.internalPatientId">{{model?.internalPatientId}}</div>
  <div *ngIf="!model.internalPatientId" style="color: white">-</div>
</div>
  <app-status [patient]="model" class="status"></app-status>

Дочерний компонент, который каждые 3 секунды рендерингасначала пустые значения, а затем правильные значения.

<div class="invitation-status-container">
  <div *ngIf="patient?.statusId === 1" class="invitation-status status-item pending">
    {{'InvitationStatus.Invited' | translate}}
  </div>
  <div *ngIf="patient?.statusId === 2" [ngClass]="{'inactive': patient?.filterStatus === 2}" class="invitation-status status-item accepted">
    <span *ngIf="patient?.filterStatus === 4">{{'InvitationStatus.Active' | translate}}</span>
    <span *ngIf="patient?.filterStatus === 2">{{'InvitationStatus.InActive' | translate}}</span>
  </div>
  <div class="invitation-status status-item rejected" *ngIf="patient?.statusId === 3">
    {{'InvitationStatus.Rejected' | translate}}
  </div>
</div>