您可以使用Angular的HttpClient库来发送多部分/form-data的POST请求,以发送两个文件。以下是一个示例代码:
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
@Injectable({
providedIn: 'root'
})
export class FileUploadService {
constructor(private http: HttpClient) { }
uploadFiles(file1: File, file2: File) {
const formData: FormData = new FormData();
formData.append('file1', file1, file1.name);
formData.append('file2', file2, file2.name);
const headers = new HttpHeaders();
headers.append('Content-Type', 'multipart/form-data');
headers.append('Accept', 'application/json');
return this.http.post('your-api-url', formData, { headers: headers });
}
}
import { Component } from '@angular/core';
import { FileUploadService } from './file-upload.service';
@Component({
selector: 'app-file-upload',
templateUrl: './file-upload.component.html',
styleUrls: ['./file-upload.component.css']
})
export class FileUploadComponent {
file1: File;
file2: File;
constructor(private fileUploadService: FileUploadService) { }
onFile1Selected(event) {
this.file1 = event.target.files[0];
}
onFile2Selected(event) {
this.file2 = event.target.files[0];
}
uploadFiles() {
this.fileUploadService.uploadFiles(this.file1, this.file2).subscribe(
response => {
console.log('Files uploaded successfully');
},
error => {
console.log('Error uploading files');
}
);
}
}
请确保替换上述代码中的"your-api-url"为您的实际API端点的URL。另外,您可能需要根据您的需求自定义请求头和错误处理。