Angular HTTP requests are failing to function properly, although they are successful when made through Postman

Question

Angular HTTP requests are failing to function properly, although they are successful when made through Postman

I am attempting to send an HTTP GET request using the specified URL:

 private materialsAPI='https://localhost:5001/api/material';

setPrice(id: any, price: any): Observable<any> {

  const url = `${this.materialsURL}/${id}/price/${price}`;


 return this.http.get<any>(url, httpOptions).pipe(
          tap(_ => this.log(`Updated material price with id=${id}`)),
          catchError(this.handleError<any>('updateMaterialPrice'))
        );
      }

However, nothing seems to be happening. When I check the network section in the browser, there is no record of the request being made. Strangely, when I try the same URL in Postman, the request goes through successfully.

javascript angular typescript http angular-http

Answer 1

Answer №1

In order for the observable to work properly, it is crucial to subscribe to it. By not calling the subscribe method on the observable, none of the actions in the chain will be executed.

Answer 2

In order for the observable to work properly, it is crucial to subscribe to it. By not calling the subscribe method on the observable, none of the actions in the chain will be executed.

Answer 3

Answer №2

It appears that the subscription to the get request was never completed. The request will initiate once you subscribe to it.

return this.http.get<any>(url,httpOptions).pipe(
  tap(_ => this.log(`updated material price id=${id}`)),
  catchError(this.handleError<any>('updateMaterialPrice'))
).subscribe((result) => {
  console.log('now it should work', result);
})

Check out https://angular.io/api/common/http/HttpClient#get

Answer 4

It appears that the subscription to the get request was never completed. The request will initiate once you subscribe to it.

return this.http.get<any>(url,httpOptions).pipe(
  tap(_ => this.log(`updated material price id=${id}`)),
  catchError(this.handleError<any>('updateMaterialPrice'))
).subscribe((result) => {
  console.log('now it should work', result);
})

Check out https://angular.io/api/common/http/HttpClient#get

Angular HTTP requests are failing to function properly, although they are successful when made through Postman

Answer №1

Answer №2

Similar questions

"Create dynamic tables with AngularJS using ng-repeat for column-specific rendering

Generating a new object from a TypeScript class using JavaScript

Verify that the zip code provided in the input matches a record in the JSON data and extract the

Integrate the element offset into jQuery's offset calculations

Displaying tooltips dynamically for newly added elements all sharing a common class in React

Connect-Domain fails to detect errors in the scenario described below:

How to use patchValue with FormArray in Angular 2

Display a span element using jQuery datatable to indicate that the update operation was

Steps for including a component in a loop using Angular 6

Unable to retrieve JSON data for the JavaScript object

Incorporate innerHTML by appending instead of overwriting

Implementing a Fixed Position for a Single Record in Extjs 4.2 Sortable Grid

Issues with style not loading properly within innerHTML in Angular2

Converting an MVC form into JSON using Jquery

To toggle between two scope variables within a view when one is not defined

animation of several rows in a table with ng-animate is not feasible

Filter items by nested properties in ngRepeat

ui-grid row size set to automatically adjust using rowHeight : 'auto'

Determine the frequency of each element in an array and arrange them in ascending order

Is there a way to prevent this JavaScript code from deleting the initial row of my table?