Angular 8 Добавление элемента в массив и обновление отображения в mat-list

У меня есть компонент загрузки файлов и сбоку список действий-матов, в котором отображаются все загруженные файлы. Когда пользователь загружает один файл, он, как и ожидалось, добавляет его в конец списка. Однако, если они загружают другой файл, он добавляет его в конец списка, но ТАКЖЕ имя ранее загруженного файла изменяется на только что загруженное. Это будет происходить с каждым дополнительным загруженным файлом! Таким образом, если они загрузят 5 файлов, все пять будут отображать последнее загруженное имя файла. Если вы покинете экран и вернетесь к нему, список правильный.

HTML:
<mat-action-list class="fileList">
          <mat-list-item *ngFor="let file of arrApplicationFiles">
            <mat-icon mat-list-icon >folder</mat-icon>
              <h4 mat-line>{{file.fdFileName}}</h4>
          </mat-list-item>
        </mat-action-list>

Метод компонента, который вызывается для добавления файла:

  arrApplicationFiles: ApplicationFile[];

  public addNewFile(file: ApplicationFile) {
    this.arrApplicationFiles.push(this.applicationFile);

Вот метод, который получает начальный список:

  public getUploadedFiles() {
    this.fileService.getFiles()
      .subscribe(
        res => {
          this.arrApplicationFiles = res;
        },
      error => {
        console.log('There was a problem retrieving files !!!' + error);
      });
  }
``

I expect it to add each added file to the bottom of the list without changing the previously added files.

1 ответ

Решение

Вы должны нажать file аргумент, а не this.applicationFile переменная

Другие вопросы по тегам