Angular 4 上传到 Symfony REST Api

Question

我想实现文件上传(在 react 形式中)，但是 $request->files->all() (来自 Symfony)总是空的。

我的表格:

    <form [formGroup]="form" (ngSubmit)="onSubmit()">
<div class="col-md-6">
                        <input type="text" pInputText id="name" formControlName="name">
                        <label for="name">Name</label>
                </div>
                <div class="col-md-6">
                        <input type="file" id="file" (change)="upload($event)">
                </div>
  // ... remaining form
  <button pButton type="button" (click)="onSubmit()" [disabled]="form.invalid" label="Save"></button>
 </form>

相关的TS代码:

// Form creation
createForm() {
    this.form = this.fb.group({
      name: ['', Validators.required],
      description: '',
      file: [null, Validators.required],
      watermark: false
    });
  }

上传:

upload(event) {
    let file = event.target.files[0];
    this.form.controls['file'].setValue(file);
  }

提交时:

onSubmit() {
    this.http.post('api/file', this.form.value).subscribe((data) => {
      console.log(data);
    });
  }

看着 Request $request对象服务器端一切正常，除了空文件: $request->files->get('file')总是 [] .

有人知道为什么吗？

Answer 1

对此的一种解决方案是不使用 formGroup但要从 $event 获取文件.我发现表单不保留文件属性，而只保留路径字符串。

我可以向您展示一次上传多个文件的示例。 HTML:

<form>
    <input placeholder="BRD File"
           type="file"
            (change)="setBrd($event.target.files[0])">
    <input placeholder="SCH File"
           (change)="setSch($event.target.files[0])"
           type="file">
    <button (click)="uploadFiles()">
        Test
    </button>
</form>

然后 typescript 部分会是这样的:

public brd: File;
public sch: File;

public setBrd(file: File) {
    this.brd = file;
}

public setSch(file: File) {
    this.sch = file;
}

public uploadCadFiles(id: ServerID, brd: File, sch: File): Observable<Blob> {
    const data = new FormData();
    data.append('brd', brd);
    data.append('sch', sch);
    return this.httpClient.post(`your-url`, data, {
        responseType: 'blob',
    });
}

在 Symfony 方面将是:

public function handleRequest(YourModule id, Request $request)
{
    if ($request->files->get('brd') && $request->files->get('sch')) {
        $brdContent = file_get_contents($request->files->get('brd'));
    }
}