HTTP PUT in angular not working properly, but no error code

Question

I have a class like this:

id: any;

phonenumber: PhoneNumberInterface;

httpOptions = {
    headers: new HttpHeaders({
    'Content-Type': 'application/json',
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
    'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept, Authorization'
})};

constructor(private route: ActivatedRoute, private httpClient: HttpClient) { }

ngOnInit() {
    this.id = this.route.snapshot.paramMap.get('id');
    this.getPhoneNumber(this.id).subscribe(phonenumber => this.phonenumber = phonenumber);
}

updatePhoneNumber(phonenumber: PhoneNumberInterface): Observable<any> {
    console.log('updatePhoneNumber is called');
    phonenumber.phoneNumberType = 'BLOCKED';
    console.log(phonenumber);
    const url = `http://localhost:8080/phonenumbersmanagement/api/v1/phonenumbers/${this.id}`;

    return this.httpClient.put(url, phonenumber, this.httpOptions).pipe();
}

getPhoneNumber(id: number): Observable<PhoneNumberInterface> {
    const url = `http://localhost:8080/phonenumbersmanagement/api/v1/phonenumbers/${id}`;

    return this.httpClient.get<PhoneNumberInterface>(url).pipe();
}

The update happens when I click on a button:

<button (click)="updatePhoneNumber((phonenumber))">Manuell sperren</button>

The focus lies on updatePhoneNumber().

I am trying to update a phonenumber, which is a big object in my rest application. Before I am using the put()-method, I am print the "phonenumber" variable to the console. It is perfectly fine, but nothing happens. The object doesn't get updated. And I also don't receive any error code. Does anybody know why?

Thank you for every answer!

add the code where you are updating the phone number, looks like you are not subscribing to the result. and what are the empty pipes for, they do nothing. — finki
– finki, Commented Feb 10, 2020 at 12:29
and accept it if it helped you, it was pretty obvious this was the mistake. — finki
– finki, Commented Feb 10, 2020 at 12:38

finki · Accepted Answer · 2020-02-10 12:43:38Z

2

This doesn't do anything:

 return this.httpClient.put(url, phonenumber, this.httpOptions).pipe();

As I said in the comment, you need to subscribe to the observable in order for the http request to get executed (like you did in ngOnInit).

 return this.httpClient.put(url, phonenumber, this.httpOptions).subscribe(console.log);

edited Feb 10, 2020 at 12:43

answered Feb 10, 2020 at 12:33

finki

2,1341 gold badge20 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jacopo Sciampi Over a year ago

Even tho this answer is correct, the you need to subscribe to the observable in order for it to evaluate the result part is wrong. If he doesn't subscribe the http won't get called. Hence nothing to evaluate.

finki Over a year ago

true, that's what i meant. fixed it

Collectives™ on Stack Overflow

HTTP PUT in angular not working properly, but no error code

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related