Question

我是angular 6的新手。我正在使用angular创建一个项目。我使用的是角度6的文件上传。我只是更新文件的模型值，但收到错误。

这是代码

<input type="file"  (change)="onFileChanged($event)" name="file" [(ngModel)]="info.file">
  ngOnInit() {
    this.info.file = this.profileImg // this contains the image path
  }



onFileChanged(event: any) {
    this.files = event.target.files;
    if (event.target.files && event.target.files[0]) {
      const file = event.target.files[0];

      const reader = new FileReader();
      reader.onload = e => this.profileImg = reader.result;

      reader.readAsDataURL(file);
    }
  }

this.profile图片是Image

之类的图片路径

错误DOMException：无法在'HTMLInputElement'上设置'value'属性：此输入元素接受文件名，该文件名只能以编程方式设置为空字符串。

Answer 1

尝试从[(ngModel)]中删除input，并用onFileChanged($event)方法绑定它。

<input type="file"  (change)="onFileChanged($event)" name="file"> 

onFileChanged(event: any) {
    this.files = event.target.files;
    if (event.target.files && event.target.files[0]) {
      const file = event.target.files[0];

      const reader = new FileReader();
      reader.onload = e => this.profileImg = reader.result;

      reader.readAsDataURL(file);

      this.info.file = this.profileImg
    }
}

看到此问题：Angular Issue

设置类型文件的ngModel值

1 个答案: