angular7输入类型文件上传不起作用答案

【问题标题】：angular7 input type file upload not workingangular7输入类型文件上传不起作用
【发布时间】：2018-11-27 06:07:58
【问题描述】：

目前我正在工作 angular angular 7 input type="file" 不工作。

Angular6 工作正常。

angular 6 提交输入文件类型数据

我会得到这样的字段列表

但是 Angular 7 只能得到这样的图像路径。

只有我将 angular 6 更新为 angular 7 我会收到此错误。什么问题我不知道。

谢谢，

【问题讨论】：

请同时添加您的代码
代码太长了我使用formcontrol名称并提交获取此类数据
错误是什么？
抱歉不是错误。 angular 6 form提交我会得到fieldlist.and angular 7 only image path get,如上图
创建一个堆栈闪电战

标签： angular angular6 angular7

【解决方案1】：

我的 Angular 应用中有一个上传文档部分，这里是工作示例：

example.component.html

<form [formGroup]="form">
<div class="form-group">
    <label>Select file to upload.</label>
    <input type="file" id="bannedList" (change)="onFileChange($event);" #fileInput>
</div>
</form>
<button type="button" (click)="onSubmit();" [disabled]="!fileInput.value" class="btn btn-success pull-right"><i class="fa fa-save fa-fw"></i> Upload File</button>

example.component.ts

import { Component, OnInit, OnDestroy, ElementRef, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup } from "@angular/forms";

...

export class exampleUploadComponent implements OnInit, OnDestroy {
  public form: FormGroup;
  @ViewChild('fileInput', { read: ElementRef }) private fileInput: ElementRef;

...

  createForm() {
    this.form = this.fb.group({
      bannedList: null
    });
  }

  onFileChange(event) {
    this.uploadStatus = 0;
    if (event.target.files.length > 0) {
      let file = event.target.files[0];
      this.form.get('bannedList').setValue(file);
    }
  }

  private prepareSave(): any {
    let input = new FormData();
    input.append('bannedChequeCustomersFile', this.form.get('bannedList').value);
    return input;
  }

  onSubmit() {
    const formModel = this.prepareSave();
    this.uploadChequeSubscription = this.chequeOperationService.uploadBannedChequeList(formModel).subscribe(
      (res) => {
        console.log("res handler:", res);
      },
      (err) => {
        console.log("err handler:", err);
      }
    );
  }

希望对你有帮助，谢谢。

【讨论】：

【解决方案2】：

var selectedElement: File = (document.getElementById(id) as HTMLElement).files[0] as File;

【讨论】：

虽然此代码可以解决问题，including an explanation 说明如何以及为什么解决问题将真正有助于提高您的帖子质量，并可能导致更多的赞成票。请记住，您正在为将来的读者回答问题，而不仅仅是现在提问的人。请edit您的回答添加解释并说明适用的限制和假设。
正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。