Angular: сбросить массив без перезагрузки представления в пользовательском интерфейсе.

Question

В настоящее время у меня есть следующий код для html:

<ng-container *ngFor="let goal of goalList;>
  <tab>
    <h3 class="...">{{goal?.title}}</h3>
    <p class="...">{{goal?.description}}</p>
  </tab>
</ng-container>

Мне нужны пустые объекты 'target', чтобы ngFor для вкладок работал. Итак, в компоненте я инициализирую массив goalList следующим образом: this.goalList = Array(goalCount) // as I know the count already.

Позже, когда я запрошу, я загружу targetList из бэкэнда с помощью Observable и заменю 'пустой' массив результатом с сервера:

this.serviceExample.goalListObservable.subscribe(
  data => this.goalList = data
));

К сожалению, в этот момент текущие значения исчезнут, так как массив позади будет перезаписан.

Можно ли изменить массив в компоненте, который получают значения в пользовательском интерфейсе обновляется автоматически?

Answer 1

Вы можете создать другой массив и сохранить в нем ответ наблюдаемого. второй массив:

<ng-container *ngFor="let goal of goalList; let i = index" [attr.data-index]="i">
  <tab>
    <ng-container *ngIf="newArray">
      <h3 class="...">{{newArray[i]?.title}}</h3>
      <p class="...">{{newArray[i]?.description}}</p>
    </ng-container>
  </tab>
</ng-container>