Get file name from input type file Angular2
HTML
<input type="file" (change)="onFileChange($event)">
Script
onFileChange(event) {
let files = event.target.files[0].name;
}
HTML
<button (click)="imgFileInput.click()">Add</button>
{{ imgFileInput?.files[0]?.name }}
<input hidden type="file" #imgFileInput (change)="uploadSingle($event)"/>
Component
uploadSingle(event) {
const fileName = event.target.files[0].name;
}
You can try a more elegant option:
HTML:
<input #file type="file" (change)="updateFile(file)">
Script:
updateFile(file: HTMLInputElement) {
let name = file.value;
}
You can do next:
HTML:
<input type="file" (change)="fileEvent($event)" />
TypeScript:
fileEvent(fileInput: Event){
let file = fileInput.target.files[0];
let fileName = file.name;
}