Проверка формы не работает на Microsoft Edge, ввод файла всегда недействителен

Я использовал проверки реактивной формы для angular 6, проверки формы отлично работают на chrome и fire-fox, но когда я попробовал это на краю и после отладки, я обнаружил, что файл типа ввода всегда имеет в нем класс ng-invalid.

Я не могу найти никакой помощи по этому поводу. Я использую проверку формы, чтобы включить отключение кнопки отправки, и она всегда отключена, потому что поле input-type-file всегда недействительно. Я не делал ничего другого, это простые проверки реактивной формы.

HTML код

<form [formGroup]="accountForm" (ngSubmit)="onAccountSave()" >

<div class="form-group required col-md-3">
     <label class="control-label mb-10 text-left">Photo Back</label>
    <input type="file" placeholder="Photo" formControlName="photo_back" (change)="onBackFileChanged($event)" >
</div>

<div class="form-group col-md-12">
   <input [disabled]="this.accountForm.invalid" class="btn btn-primary" type="submit" value="Save">
</div>

Код TS

 this.accountForm = this.formBuilder.group({
      // other fields .....
      photo_back : ['', Validators.required],

    });

polyfill.ts

 import 'core-js/es6/symbol';
 import 'core-js/es6/object';
 import 'core-js/es6/function';
 import 'core-js/es6/parse-int';
 import 'core-js/es6/parse-float';
 import 'core-js/es6/number';
 import 'core-js/es6/math';
 import 'core-js/es6/string';
 import 'core-js/es6/date';
 import 'core-js/es6/array';
 import 'core-js/es6/regexp';
 import 'core-js/es6/map';
 import 'core-js/es6/weak-map';
 import 'core-js/es6/set';
 import 'classlist.js';  // Run `npm install --save classlist.js`.
 import 'core-js/es6/reflect';
import 'core-js/es7/reflect';
import 'zone.js/dist/zone';  // Included with Angular CLI.

angular microsoft-edge angular-validation
person Naveen Singh    schedule 17.04.2019    source источник
comment
Включили ли вы функции IE в файл polyfills.ts?   -  person Fedor Patutinskiy    schedule 17.04.2019
comment
@FedorPatutinskiy Я не мог подскажите, где это добавить?   -  person Naveen Singh    schedule 17.04.2019
comment
Вы используете angular cli для своего проекта?   -  person Fedor Patutinskiy    schedule 17.04.2019
comment
@FedorPatutinskiy да   -  person Naveen Singh    schedule 17.04.2019
comment
После того, как вы создали приложение, у вас должен быть файл polyfills.ts. И в этом файле есть часть, где вам просто нужно удалить некоторые строки, если вы хотите использовать приложение в IE.   -  person Fedor Patutinskiy    schedule 17.04.2019
comment
Я не прокомментировал все файлы, связанные с IE, но он все еще не работает, проверка других полей работает, но не работают только проверки полей файлов. @FedorPatutinskiy Я обновил вопросы файлом polyfill.ts.   -  person Naveen Singh    schedule 17.04.2019

Ответы (2)


arrow_upward
0
arrow_downward

Я пока не могу комментировать из-за моей низкой оценки, но я хотел сказать вам, что в IE11 (и, возможно, Edge тоже) есть ошибка, которая помечает каждый элемент управления формой как грязный, если у него есть свойство заполнителя. Пожалуйста, попробуйте удалить свойство заполнителя и проверьте, является ли форма по-прежнему недействительной в реальном "изначальном" статусе.

person Severin Klug    schedule 17.04.2019

arrow_upward
0
arrow_downward

Вы можете обратиться к этому образцу и попробуйте добавить необходимое свойство во входной файл:

<form [formGroup]="profileForm" (ngSubmit)="onSubmit()">
  <label>
    First Name:
    <input type="text" formControlName="firstName" required>
  </label>

  <button type="submit" [disabled]="!profileForm.valid">Submit</button>
</form>
person Zhi Lv    schedule 19.04.2019