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

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

2 голосов
/ 01 октября 2019

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

1 голос
/ 01 октября 2019

Вы должны использовать аргумент file, а не this.applicationFile переменную

...