Nodejs - Angular Upload File to server Not found 404

Question

I am new in Angular, and trying to upload file from front-end to the server but I get failed in that.

post the file using Postman is working successfully, but when I apply on the browser I got the error below in the image:

my code as the following:

.service.ts file (The service function is)

upload_document(ProductID: any, document_data: any, file_data: any):Observable<any> {
    return this.httpClient.post(`${API_SERVER_URL}/api/products/upload_document/${ProductID}`, {document_data: document_data, file_data:file_data}).pipe(
      tap(async (res: any)=>{
        console.log(res);
      })
    )
  }

.component.ts (uploadFile + clickUpload) functions

uploadFile(event: Event) {
    const element = event.currentTarget as HTMLInputElement;
    let fileList: FileList | null = element.files;
    if (fileList) {
      console.log("FileUpload -> files", fileList);
    }
  }



  clickUpload() {

    this.productService.upload_document(this.ProductID, this.frmGroup.value, this.file_data).subscribe(
      result=>{
        this.frmGroup.get('FileName')?.setValue('');
        this.frmGroup.get('CategoryID')?.setValue('');
        this.frmGroup.get('Remarks')?.setValue('');
        this.frmGroup.get('Path')?.setValue('');
        this.frmGroup.get('UploadedBy')?.setValue('');

        alert("Document Uploaded");
      },
      error => {
        alert("Please Try Again");
      })
  }

.component.html

<form #formSubmit="ngForm" class="col-md-offset-3 col-md-6" [formGroup]="frmGroup" (ngSubmit)="clickUpload()">

    <input type="file" name="Path" formControlName="Path" accept="image/png, image/jpeg, application/pdf" (change)="uploadFile($event)">

    <label>File Name</label>
    <input type="text" name="FileName" formControlName="FileName">

    <button type="submit" class="bg-primary">Upload</button>

  </form>```



I need a help to upload the file to backend server (API call)