Входной файл Angular 6 предотвращает открытие диалогового окна

Question

У меня простой ввод типа file, и мне нужно проверить булеву переменную, прежде чем открывать диалоговое окно file, чтобы выбрать файл.Есть ли способ сделать это?Это мой код:

<input type="file" id="uploadFile" [disabled]="disableUpload" (change)="onUpload($event)" />

При нажатии на ввод открывается диалоговое окно файла.Мне нужно сделать проверку, чтобы, если положительный, заблокировать открытие диалогового окна файла.Спасибо всем!

Answer 1

Вы можете попробовать добавить attr.disabled вместо disabled

<input [attr.disabled]="disableUpload ? '' : null"/>

Или, если вы используете реактивные формы (я предлагаю вам это сделать), вы можете отключить егоиспользуя элемент управления формы.

ОБНОВЛЕНИЕ

Вы можете назначить метод для события click при вводе файла, а затем проверить логическое значение для выполнения требуемой операции.

В компоненте:

fileDialogShouldOpen = false;

fileInputClick = (event) => {

    // Open file dialog
    if(this.fileDialogShouldOpen){
      return true;
    }
    // Do not open file dialog
    else{

      event.preventDefault();
      event.stopPropagation();
      return false;
    }
}

И в шаблоне:

<input type="file" (click)="fileInputClick($event)">

Рабочий пример можно найти в этом проекте stackblitz