Блог

У меня есть угловая форма, поддерживаемая фреймворком пользовательского интерфейса PrimeNG. Я удалил кнопку загрузки, потому что мне нужна вся логика загрузки, которая срабатывает только при нажатии кнопки «Прогресс загрузки». Как я все еще могу ссылаться на файловую переменную? При срабатывании onSubmitProgress() имя файла остается пустым

Экран TS

   onAttachmentSelected(event: any) {
    this.uploadedFiles = event.files;
    console.log('selected attachment file:', this.uploadedFiles[0].name)
  }
  onAttachmentHandled(event) {
    console.log('handing the file ')
  }
  onSubmitProgress() {
    // upload file
    console.log('submit attachment file:', this.uploadedFiles)
  }
 

HTML

 <div class="p-field p-col-12 p-md-3">
  <p-fileUpload name="x" [customUpload]="true" 
 [showUploadButton]="false" (onSelect)="onAttachmentSelected($event)" (uploadHandler)="onAttachmentHandled($event)"
 [maxFileSize]="5000000"></p-fileUpload>
</div>

<div class="p-field p-col-12 p-md-3">
  <button pButton label="Update Progress" (click)="onSubmitProgress()"></button>
</div>
 

HTML

 <p-fileUpload name="uploadAvatar"
              [customUpload]="true"
              (uploadHandler)="onFileUploadClicked($event)"
              (onSelect)="onSelectFile($event)"
              accept="image/*"
              [maxFileSize]="500000">
</p-fileUpload>
 

тс

 onFileUploadClicked(event: {files: Blob[]}) {
   doSomthingWithFile(event.files[0]);
}

onSelectFile(event: {files: FormData[]}) {
    this.uploadedFiles = event.files;
}