Как создать пользовательскую кнопку загрузки файла в Angular

Question

Я бы хотел заменить текст «Выбрать файл» и некрасивый стиль кнопки <input type="file" /> другим текстом, таким как «Загрузить» и приятный стиль, возможно, используя mat-button.Какой самый чистый способ достичь этого без установки каких-либо дополнительных пакетов для загрузки файлов?

Answer 1

Используйте приведенный ниже шаблон:

.html:

<button type="button" (click)="fileInput.click()">
  <span>Upload</span>
  <input #fileInput type="file" (change)="onFileInput($event)" style="display:none;" />
</button>

Функция щелчка предложит пользователю выбрать файл.