Question

当我尝试将文件blob分配给File对象时，它会出现以下错误：

core.js：1448 ERROR错误：未捕获（在承诺中）：InvalidStateError：无法设置＆＃39;值＆＃39;属性＆＃39; HTMLInputElement＆＃39;：此输入 element接受一个文件名，该文件名只能以编程方式设置为空字符串。错误：无法设置＆＃39;值＆＃39;财产＆＃39; HTMLInputElement＆＃39;：此输入元素接受可能的文件名只能以编程方式设置为空字符串。

我在console.log()进入内容时检查了内容，它确实给了我文件的内容。当我尝试将其分配给examen_bestand时，为什么会给我错误？

HTML：

<input type="file" [(ngModel)]="examen_bestand" name="examen_bestand" class="form-control-file" id="exampleInputFile" aria-describedby="fileHelp" (change)="fileChanged($event)">

TS：

export class StudentUploadComponent implements OnInit {
  @Input() examensStudent: Examen[] = [];
  examen_id: number;
  examen_bestand: any;

  constructor(private serv: ExamService) { }

  onSubmit(form) {
    console.log(form.values);
  }

  fileChanged(e) {
    const reader = new FileReader();
    reader.onload = () => {
      this.examen_bestand = reader.result;
    };
    reader.readAsText(e.target.files[0]);
  }

  ngOnInit() {
    this.serv.getExams().subscribe(data => this.examensStudent = data);
  }

}

Answer 1

删除ngModel。这是您在此时可能不需要的stackblitz。：）

Answer 2

我遇到了这个错误，并且解决了。至少对我来说，是因为在我的输入中，输入字段中的“值”设置为this.state.image，如下所示：

          <label htmlFor='image'>
                    Image
                    <input 
                        type='file' 
                        id='file' 
                        name="file"
                        placeholder="Upload an Image" 
                        required 
                        value={this.state.image}
                        onChange={this.uploadFile}
                        />
                </label>

我删除了值= {this.state.image}

它开始工作。

希望这会有所帮助。

无法设置＆＃39;值＆＃39;属性＆＃39; HTMLInputElement＆＃39;

2 个答案: