В теме Metronic у меня есть FormWizard с четырьмя вкладками. На второй вкладке я загружаю изображение из моей файловой системы в поле ввода и пытаюсь сохранить всю форму на четвертой вкладке. В случае, если я пропустил заполнение некоторых полей, и серверная часть выдает сообщение об ошибке, я возвращаюсь ко второй вкладке, и мое изображение исчезает, пока я не начну что-либо записывать в другое поле ввода рядом с вводом изображения. Когда я начинаю печатать, изображение сразу становится видимым.
В app.module.ts
Я уже установил это: changeDetection: ChangeDetectionStrategy.Default
<!--begin: Form Wizard Step 2-->
<div class="kt-wizard-v4__content" data-ktwizard-type="step-content">
<div class="kt-section kt-section--first">
<div class="kt-wizard-v4__form">
<div class="kt-portlet kt-portlet--bordered">
<div class="kt-portlet__head">
<div class="kt-portlet__head-label">
<h3 class="kt-portlet__head-title">
Galéria
<span class="required-field">*</span>
<i class="fa fa-info-circle kt-font-info"
data-toggle="kt-popover" title=""
data-content="And here's some amazing content. It's very engaging. Right?"
data-original-title="Popover title">
</i>
</h3>
</div>
<div class="kt-portlet__head-toolbar">
<div class="kt-portlet__head-actions">
<label for="file" title="Kép felviteléhez kattintson ide">
<input #file type="file" name="image" accept=".png, .jpg, .jpeg" id="file"
class="inputfile" (change)="onSelectFile($event)">
<button href="#" (click)="file.click()" class="btn btn-success btn-pill btn-wide">
képfeltöltés
</button>
</label>
</div>
</div>
</div>
onSelectFile(event) {
let element: HTMLElement =
document.querySelector('input[type="file"]') as HTMLElement;
element.click();
if (event.target.files && event.target.files[0]) {
const file = event.target.files[0];
const reader = new FileReader();
reader.readAsDataURL(file); // read file as data url
reader.onload = (event) => { // called once readAsDataURL is completed
this.addPicture(reader.result, file);
this.changeDetectorRef.detectChanges();
};
}
}
![enter image description here](https://i.stack.imgur.com/QO26S.png)
Нет сообщения об ошибке, только изображение невидимо.