How do i...when subscribe upload file service I get error no overload matches this call?

Question

0.00/5 (No votes)

See more:

I work on angular 7 and face an issue when trying to upload a file

TypeScript

DeliverySysService
PostUpload(selectedoptionsId, file) {
  const formData: FormData = new FormData();
  formData.append('file', file,file.name);
  formData.append('selectedoptions',selectedoptionsId.toString());
  return this.http.post('http://localhost:61265/api/DeliverySys/', formData);
}

when subscribing to function from the service above I get the issue on lines below :

error description : No overload matches this call. Overload 1 of 5, '(observer?: PartialObserver): Subscription', gave the following error.

Argument of type '(response: Blob) => any' is not assignable to parameter of type

'PartialObserver'. Property 'complete' is missing in type '(response: Blob) => any' but required in type 'CompletionObserver'.

Overload 2 of 5, '(next?: (value: Response) => void, error?: (error: any) => void, complete?: ()

=> void): Subscription', gave the following error.

What I have tried:

what i ry like below and that is generated error :

TypeScript

this._dataService.PostUpload(this.selectedoptions.toString(),this.fileToUpload)
     .subscribe((response: Blob) => saveAs(response, this.fileToUpload.name + '.xlsx'));

Posted 15-Jun-21 4:26am

ahmed_sa

Updated 15-Jun-21 4:45am

Add a Solution

Comments

ahmed_sa 15-Jun-21 10:42am

can any one help me
my issue online below
this._dataService.PostUpload(this.selectedoptions.toString(),this.fileToUpload)
.subscribe((response: Blob) => saveAs(response, this.fileToUpload.name + '.xlsx'));

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Chris Copeland · Answer 1 · 2021-06-15T04:45:00

Solution 1

Assuming this is Angular, your method declaration seems to be missing some type declarations which would allow Typescript to correctly identify the return type of the post() method:

JavaScript

PostUpload(selectedoptionsId, file) {
  const formData: FormData = new FormData();
  formData.append('file', file,file.name);
  formData.append('selectedoptions',selectedoptionsId.toString());
  return this.http.post('http://localhost:61265/api/DeliverySys/', formData);
}

Typescript is going to interpret the default return type as any, which means the call to this.http.post() is ambiguous. Could you try adding the correct return type to the method?

JavaScript

PostUpload(selectedoptionsId, file): Observable<Blob> {

Posted 15-Jun-21 4:45am

Chris Copeland

Comments

ahmed_sa 15-Jun-21 10:58am

on service i got this error

Type 'Observable<response>' is not assignable to type 'Observable<blob>'.
Type 'Response' is missing the following properties from type 'Blob': size, slice, streamts(2322)
after i modify function to
PostUpload(selectedoptionsId, file): Observable<blob> {
can you please help me

Chris Copeland 15-Jun-21 11:38am

What is the type of this.http? It looks like it's returning an Observable<Response> which isn't a documented HttpClient return type.

ahmed_sa 15-Jun-21 11:56am

i try to do like below

PostUpload(selectedoptionsId, file):Observable<response>
{
const formData: FormData = new FormData();
formData.append('file', file,file.name);
formData.append('selectedoptions',selectedoptionsId.toString());
return this.http.post('http://localhost:61265/api/DeliverySys/', formData);
}
error as below

is not assignable to type 'import("e:/TestInternalSystemZ2Data/FullProjectAngApiLastUpdate/Z2DataAngularV1.8/node_modules/rxjs/internal/Observable").Observable<response>'.
Type 'Response' is missing the following properties from type 'Response': redirected, trailer, clone, body, and 2 more.ts(2322)

ahmed_sa 15-Jun-21 10:59am

without doing service and call function
i make that and it working
this.http.post('http://localhost:61265/api/DeliverySys/', formData,{ responseType: 'blob' })
.subscribe((response: Blob) => saveAs(response, this.fileToUpload.name + '.xlsx'));
so please how to call function to give me same result

ahmed_sa 15-Jun-21 11:10am

but why function call above give me error

ahmed_sa 15-Jun-21 11:52am

this is my function
can you help me tell me
how to call it please
without make service and function
thi is below do what i need

this.http.post('http://localhost:61265/api/DeliverySys/', formData,{ responseType: 'blob' })
.subscribe((response: Blob) => saveAs(response, this.fileToUpload.name + '.xlsx'));

PostUpload(selectedoptionsId, file)
{
const formData: FormData = new FormData();
formData.append('file', file,file.name);
formData.append('selectedoptions',selectedoptionsId.toString());
return this.http.post('http://localhost:61265/api/DeliverySys/', formData);
}
i make it as you tell me

PostUpload(selectedoptionsId, file): Observable<blob> {
and it give me error