Получить имя файла из файла типа ввода Angular2

Вы можете сделать следующее:

HTML:

<input type="file" (change)="fileEvent($event)" />

Машинопись:

fileEvent(fileInput: Event){
    let file = fileInput.target.files[0];
    let fileName = file.name;
}

Можно попробовать более элегантный вариант:

HTML:

<input #file type="file" (change)="updateFile(file)">

Скрипт:

updateFile(file: HTMLInputElement) {
  let name = file.value;
}

HTML

<button (click)="imgFileInput.click()">Add</button>
    {{ imgFileInput?.files[0]?.name }}
<input hidden type="file" #imgFileInput (change)="uploadSingle($event)"/>

Компонент

uploadSingle(event) {
  const fileName = event.target.files[0].name;
}

HTML

<input type="file" (change)="onFileChange($event)">

Скрипт

onFileChange(event) {    
     let files = event.target.files[0].name;
}

Эта работа формирует меня:

HTML

<input type="file" (change)="detectFiles($event)">
<div class="output">Seleccionado: {{ fileName }} </div>

ТС

selectedFiles: FileList;
fileName: string;

detectFiles(event) {
    this.selectedFiles = event.target.files;
    this.fileName = this.selectedFiles[0].name;
    console.log('selectedFiles: ' + this.fileName );
  }

Решение этой ссылки https://stackoverflow.com/a/44932086/4281182, предложенное @ Selçuk Cihan, не помогло, поэтому мой Обходной путь состоял в том, чтобы сделать тип параметра fileInput «любым», выполнив это

fileEvent(fileInput){
    let file = fileInput.target.files[0];
    let fileName = file.name;
}

поэтому во время выполнения TS это чистый код JS

В любом случае спасибо за это здорово, и это сэкономило мне много времени