Call json file from url

Question

I'm trying to call json file from url and get data. But no error and nothing working. I don't have any idea how to solve it.

service

export class JsonService {


  public getMenuData(): Observable<any> {
    
    return new Observable((observer) => {
      this.http.get('https://demored.ddns.net:50443/demored/path_image/menu.json').subscribe((response)=> {
        observer.next(response);
        observer.complete();
      });
    });
  }

Component

ngOnInit() {

    this.getJson();
    
  }

  getJson(){
    this.jsonService.getMenuData().toPromise().then(data => {
      this.menuJson = data;
      console.log("Menu from json file ",this.menuJson);
    }).catch((err) => {
      console.log('error in fetching data',err);
    });
  }

Can you reproduce it on Stackblitz? Anyway, the website where you're trying to get the json has an expired certificate and presents a 404, I expect it to return an error, but it can be related — Christian Vincenzo Traina
– Christian Vincenzo Traina, Commented Jun 2, 2021 at 23:51

Nicholas K · Accepted Answer · 2021-06-03 05:36:38Z

1

You make the GET request on the service, where you convert the request into a promise with toPromise(). From there in any component you can call the method for the service declared in the constructor this.serviceJson() and resolve the promise with a .then () or .catch ()

export class JsonService {
  
  getMenuData(): Promise<any> {
   return this.http.get<any>('https://demored.ddns.net:50443/demored/path_image/menu.json').toPromise()
  }

component

  ngOnInit() {

    this.getJson();
    
  }

  async getJson(){
   await this.jsonService.getMenuData().then(data => {
      this.menuJson = data;
      console.log("Menu from json file ",this.menuJson);
    }).catch((err) => {
      console.log('error in fetching data',err);
    });
  }

edited Jun 3, 2021 at 5:36

Nicholas K

15.4k8 gold badges35 silver badges59 bronze badges

answered Jun 2, 2021 at 23:46

Hamada

1,9543 gold badges17 silver badges30 bronze badges

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

3 Comments

Christian Vincenzo Traina Over a year ago

Could you please explain?

Hamada Over a year ago

Ok, make shore you use async/await.

Fash Over a year ago

Thanks for your answer.., I got error url A class member cannot have the 'const' keyword

Collectives™ on Stack Overflow

Call json file from url

1 Answer 1

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Related