Angular5 文件上传

我正在尝试在我的 Web 应用程序中上传一个或多个文件。我已尝试使用 vData.service.ts 文件引起的代码和错误

错误：在 VDataservice 上不存在
属性“yoursHeadersConfig” 在“可观察”
属性上不存在属性“catchError” 在“VDataservice”上不存在属性“HandleError”

您能否让我知道如何解决该问题并提供在 Web 应用程序中上传多个文件的想法？我已经为这个问题提供了完整的相关代码。

吉斯特链接：
ad.component.html：https://gist.github.com/aarivalagan/ac15e8e2c6f77d0687c01a70e18bca6b广告：component.ts：https://gist.github.com/aarivalagan/a9c1d22c1d6056da624f0968fb6cd59c vData.service.ts：HTTPS：/ /gist.github.com/aarivalagan/8bfbe47ef8cf0dac267374a8f0ef5b0f

代码：ad.component.html

<div class="form-group col-sm-12">
        <label for="usr">Choose file to Upload </label>
        <input type="file" multiple formControlName="file" class="form-control" id="file" (change)="handleFileInput($event.target.files)" accept=".pdf,.docx" required>
      </div>

ad.component.ts

handleFileInput(files: FileList) {
        this.fileToUpload = files.item(0);
    }
    uploadFileToActivity() {
        this.fileUploadService.postFile(this.fileToUpload).subscribe(data => {
          // do something, if upload success
          }, error => {
            console.log(error);
          });
      }

vData.service.ts

postFile(fileToUpload: File): Observable<boolean> {
        const endpoint = 'your-destination-url';
        const formData: FormData = new FormData();
        formData.append('fileKey', fileToUpload, fileToUpload.name);
        return this.http
          .post(endpoint, formData, { headers: this.yourHeadersConfig })
          .map(() => { return true; })
          .catchError((e) => this.handleError(e));
          }