[英]angular7 input type file upload not working
我的 Angular 应用程序中有一个上传文档部分,这是一个工作示例:
示例.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>
示例.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);
}
);
}
我希望它会有所帮助,谢谢。
var selectedElement: File = (document.getElementById(id) as HTMLElement).files[0] as File;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.