Как я могу сохранить http получить объект ответа в угловых 6

Question

Я новичок в angular, и я пытаюсь выяснить, как я могу сохранить в локальной переменной ответ http.get(url)

Вот мой код:

export class AppComponent {

  private url = 'http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&api_key=MY_KEY&format=json&artist=The+Weeknd' ;
  public data;

  constructor(private http: HttpClient) { 
    this.http.get(this.url).subscribe(response => this.data = response);
    console.log(this.data); // -> The result is undefined...
  }

}

Сначала я попробовал this.http.get(this.url).subscribe(response => console.log(response));, и это сработало, как и ожидалось, однако назначение не работает.

Большое спасибо!

Answer 1

Ваш код абсолютно правильный. Причина, по которой console.log не показывает значение ответа, заключается в том, что он работает ДО обработки ответа. После запуска HTTP-запроса JavaScript продолжает выполнять текущую функцию.

Если вы хотите зарегистрировать ответ, вы должны сделать это внутри обработчика ответа

export class AppComponent {

  private url = 'http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&api_key=MY_KEY&format=json&artist=The+Weeknd' ;
  public data;

  constructor(private http: HttpClient) { 
    this.http.get(this.url).subscribe(response => {
        this.data = response;
        console.log(this.data);
    });
  }    
}

Answer 2

Вы делаете асинхронный HTTP-вызов. поэтому вам нужно добавить console.log внутри подписки.

export class AppComponent {

  private url = 'http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&api_key=MY_KEY&format=json&artist=The+Weeknd' ;
  public data;

  constructor(private http: HttpClient) { 
    this.http.get(this.url).subscribe(response => {
       this.data = response;
       console.log(this.data);
    });
  }