Как вызвать событие нажатия входного файла от нажатия кнопки в угловых 2?
@Bozho уже предоставил отличный ответ
Обычно вы размещаете эти типы констант в объекте Configuration (который имеет геттеры и сеттеры) в контексте сервлета и получаете к ним доступ с помощью $ {applicationScope .config.url}
Тем не менее, я чувствую, что нужен пример, чтобы он приносил немного большей ясности и оставлял чье-то время
@Component public Configuration implements ServletContextAware { private String addressURL = Addresses.URL; // Declare other properties if you need as also add corresponding // getters and setters public String getAddressURL() { return addressURL; } public void setServletContext(ServletContext servletContext) { servletContext.setAttribute("config", this); } }
4 ответа
Вы можете использовать ссылочную переменную шаблона следующим образом:
<input type="file" accept="image/*" #file>
<button (click)="file.click()">Upload file</button>
Соответствующий plunkr находится здесь https://plnkr.co/edit/JB4HY0oxEUgXXIht2wAv?p=preview
Вы могли бы объявить переменную для поля входного файла как #file & amp; тогда только изменение файла вызывает функцию upload для передачи загруженного файла в функцию.
<input #file type="file" accept="image/*" (change)="upload(file.files)">
<button #upload (click)="file.click()">Upload file</button>
В Angular 4,
HTML:
<input #fileUpload type="file" (click)="fileUpload.value = null"(change)="importFile($event)" style="display:none"
accept="image/*">
<button (click)="fileUpload.click()"> </button>
Машинопись:
importFile(event) {
if (event.target.files.length == 0) {
console.log("No file selected!");
return
}
let file: File = event.target.files[0];
// after here 'file' can be accessed and used for further process
}
При рассмотрении вопроса о будущем выборе того же файла, который не работает, Во входном теге событие щелчка, которое мы устанавливаем равным нулю, что позволяет выбрать тот же файл во второй раз.
В Angular 4,
HTML:
<ion-input type="file" formControlName="avatar"></ion-input>
<button type="button" ion-button (click)="selectFile()"></button>
Javascript:
selectFile() {
let element: HTMLElement = document.querySelector('input[type="file"]') as HTMLElement;
element.click();
}
Это работа для меня.