Arhn - архитектура программирования

Загрузка файла Angular IE11 Отменить событие

У нас есть приложение, в котором нам нужно поддерживать IE11 с функцией загрузки файлов. Версия angular — Angular 11.

Существует элемент управления загрузкой файлов, который отлично работает во всех браузерах, кроме IE11, где у нас возникла проблема с кнопкой «Отмена» в диалоговом окне файла.

<input #fileUploadCtrl class="form-control" type="file" (change)="onFileChange($event)" 

В основном, когда пользователь нажимает кнопку «Отмена», уже выбранный файл должен быть удален из элемента управления вводом. Событие изменения работает, только если пользователь выбирает файл и нажимает кнопку «Открыть». Однако событие изменения не запускается при нажатии кнопки «Отмена».

Как мы можем захватить событие отмены и очистить элемент управления вводом файла в Angular? Если нет, есть ли обходной путь для очистки загрузки файла, когда пользователь нажимает кнопку «Отмена»?



Ответы:


1

Как и в комментарии myjscoffee, событие отмены не может быть обнаружено. Файл <input> в IE 11 доступен только для чтения, поэтому вы не можете очистить его так, как думаете. Это по дизайну в IE. Вы также можете обратиться к этой ветке.

Единственный способ очистить входной файл в IE — добавить сброс <button> и при нажатии на кнопку очистить файл <input>. Вы можете обратиться к следующему фрагменту кода:

app.component.html:

<input #fileUploadCtrl type="file">
<button type="button" (click)="reset(fileUploadCtrl)">Reset</button>

app.component.ts:

reset(element) {
    element.value = "";
}
12.03.2021
Новые материалы

Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..