上传功能:我想绑定文件/图像,怎么可能?



上传功能:我想绑定文件/图像,怎么可能? 我不知道如何在参数中传递表单数据

upload() {
let inputEl: HTMLInputElement = this.inputEl.nativeElement;
let fileCount: number = inputEl.files.length;
let formData = new FormData();
console.log(formData)
if (fileCount > 0) { // a file was selected
for (let i = 0; i < fileCount; i++) {
formData.append('file[]', inputEl.files.item(i));
}
this.http
.post(this.uploadUrl, formData)
.subscribe(
data => {
alert ('Update successful');
},
error => {
alert  ('Not updated');
this.loading = false;
});
}

网页组件 :

<form>
<div>
<input type="file" [multiple]="multiple" #fileInput>
<button type="button" (click)="upload()">Upload</button>
</div>
</form>
<input type="file" (change)="fileChange($event)" placeholder="Upload 
file" accept=".pdf,.doc,.docx">
fileChange(event) {
let fileList: FileList = event.target.files;
if(fileList.length > 0) {
let file: File = fileList[0];
let formData:FormData = new FormData();
formData.append('uploadFile', file, file.name);
let headers = new Headers();
/** No need to include Content-Type in Angular 4 */
headers.append('Content-Type', 'multipart/form-data');
headers.append('Accept', 'application/json');
let options = new RequestOptions({ headers: headers });
this.http.post(`${this.apiEndPoint}`, formData, options)
.map(res => res.json())
.catch(error => Observable.throw(error))
.subscribe(
data => console.log('success'),
error => console.log(error)
)
}

}

最新更新