각도 2 여러 파일 업로드

Question

여러 파일 (PDF 또는 다양한 이미지 형식)을 업로드하려고합니다. 지금은 하나의 파일 만 업로드해도 작동하지만 다중 파일은 작동하지 않습니다.

HTML :

<div> 
    <label> Upload PDF(s) or Images (PNG/JPG/DICOM/DCM):</label> 
    <div class="ctrl"> 
     <div class="icon"> 
      <i class="fa fa-file-image-o"></i> 
     </div> 
     <input type="file" (change)="onChange($event)"/> 
     <md-input class="ctrl" [(ngModel)]="fileName"></md-input> 
    </div> 
</div> 

스크립트 :

onChange(event: any) { 
    this.fileName = event.srcElement.files[0].name; 
} 

어떻게 여러 개의 파일을 업로드 할하는 데 도움이

이

는 코드입니다. ,

<input type="file" (change)="onChange($event)" multiple /> 

그리고 당신의 입력에있는 모든 파일 이름을 표시하려면이 plunker에서처럼 수행합니다 :

Answer 1

입력 당신에게 multiple 속성을 추가 https://plnkr.co/edit/WvkNbwXpAkD14r417cYM?p=preview

import {Component, NgModule} from '@angular/core' 
import {BrowserModule} from '@angular/platform-browser' 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2>Hello {{name}}</h2> 
     <input type="file" multiple (change)="onChange($event, showFileNames)" /> 
     <input #showFileNames /> 
    </div> 
    `, 
}) 
export class App { 
    constructor() { 
    this.name = 'Angular2' 
    } 

    onChange(event: any, input: any) { 
    let files = [].slice.call(event.target.files); 

    input.value = files.map(f => f.name).join(', '); 
    } 
} 

@NgModule({ 
    imports: [ BrowserModule ], 
    declarations: [ App ], 
    bootstrap: [ App ] 
}) 
export class AppModule {} 

또는 대신 당신의 변수를 사용 그것을 그 입력에 직접 두는 것! 당신이 나를 위해 일한이 시도 할 수

Answer 2

)의 답장을

https://github.com/jkuri/ng2-uploader