why Multiple file selection not working with multiple attribute?

Question

I want to upload multiple files,and i create a input field with attribute multiple,But i couldnt select multiple files.

app.html

<input type="file" (change)="onChange($event)" required class="form-control " multiple> component.ts

    onChange(event: any) {
    let fileList: FileList = event.target.files;
    console.log(event.target.files)
    if(fileList.length > 0) {
    let file: File = fileList[0];
    let formData:FormData = new FormData();
    formData.append('degree_attachment', file, file.name);
    let headers = new Headers();
    headers.append('Accept', 'application/json');
    let options = new RequestOptions({ headers: headers });
    this.http.post('http://localhost:8080/EventManager/UploadFile', 
    formData,options)
    .map(res => res.json())
    .catch(error => Observable.throw(error))
    .subscribe(
        data => console.log('success'),
        error => console.log(error)
    )
  }}

Does this work: https://stackoverflow.com/a/16701951/5950725 ? — Tom, Jul 08 '17 at 17:41
Possible duplicate of [How to select multiple files with ?](https://stackoverflow.com/questions/1593225/how-to-select-multiple-files-with-input-type-file) — Roman C, Jul 08 '17 at 18:10

Tom · Answer 1 · 2018-03-29T06:29:40.180

0

It should be able to select multiple files.

Live demo: Plunker

Code:

@Component({
  selector: 'my-app',
  template: `
    <form enctype='multipart/form-data'> 
      <input 
        (change)="onChange($event)"
        type='file'
        name='files[]'
        multiple
      />

      <button type='submit'>Submit</button>
    </form>
  `,
})
export class App {
  onChange(event: any) {
    let fileList: FileList = event.target.files;
    console.log(event.target.files)
  }}
}

edited Mar 29 '18 at 06:29

answered Jul 08 '17 at 19:50

Tom

4,776
2
38
50

@FranklinPious it does for me. Please see the amended answer – Tom Mar 29 '18 at 06:18

why Multiple file selection not working with multiple attribute?

1 Answers1