Установите значение ввода файла в Angular 8 при редактировании элемента - PullRequest
1 голос
/ 04 октября 2019

У меня есть угловая 8-я программа, в которой я хочу отредактировать элемент после нажатия кнопки «Изменить», и значение отображается в соответствующих формах. Таким образом, для имени значение будет отображаться в имени ввода текста. Возраст будет отображаться при вводе текста возраста и т. Д. Проблема заключается в том, что при нажатии кнопки «Изменить» файл ввода изображения не отображает или не удерживает изображение. Теперь, как мне отобразить это изображение по умолчанию при нажатии кнопки редактирования, похожей на текстовые файлы? Я знаю, что для ввода текста используется [(ngModel)] = "value"/>, но это не похоже на работу с входными файлами. Ниже мой код для входного файла изображения и соответствующего файла TS.

HTML

<div class="form-group">
 <input formControlName="ProductFile" #file type="file" name="photo" ng2FileSelect [uploader]="uploader" (change)="previewImage(file.files)" />
 <div [hidden]="!imgURL">
  <img [src]="imgURL || '//:0'" height="200" >
 </div>              
</div>

edit file.ts

previewImage(files, product) {
    if (files.length === 0)
      return;

    var mimeType = files[0].type;
    if (mimeType.match(/image\/*/) == null) {
      return alert('Only image files!');
    }

    var reader = new FileReader();
    this.imagePath = files;
    reader.readAsDataURL(files[0]); 
    reader.onload = (_event) => { 
      //upload percentage
      this.uploadPercent = new Observable((observer) => {
        Math.round((_event.loaded / _event.total) * 100);  
      });
      this.imgURL = reader.result; 
    }
  }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...