Subscribe () return undefined без консоли в Angular 5

Raman спросил: 28 апреля 2018 в 09:21 в: angular

Мой проект находится в Angular 5, и мне нужно сохранить ответ API в Variable. Когда я размещал console.log внутри подписки, он возвращает json-массив, но без console.log() subscribe() возвращает undefined.

Мой код

 export class GalleryComponent {
 private apiUrl = 'http://fullpath';
 private response: any;
 private data: any;
 private category: any; constructor(private http: HttpClient) {
   this.getCategory();
 } /*getCategory() {
  this.http.post(this.apiUrl, {}).subscribe(res => {
     console.log(this.response = res['result']['data']);
  });---------------------This returns JSON data from API successfully*/
 getCategory() {
   this.http.post(this.apiUrl, {}).subscribe(res => {
      this.response = res['result']['data'];
   });
   console.log(this.response);//------This returns undefined
   }
 }

Я новичок в Angular. Как я могу это решить.

3 ответа

Есть решение
Sangwin Gawande ответил: 28 апреля 2018 в 09:45

Попробуйте следующее:

http вызовы asynchronous, вам нужно написать console.log в подписке для печати response.

getCategory() {
   this.http.post(this.apiUrl, {}).subscribe(res => {
     this.response = res['result']['data'];
     console.log(this.response);//<------This Will Work
    });
}
Raman ответил: 28 апреля 2018 в 09:45
Могу ли я сделать ngFor после этого?
Sangwin Gawande ответил: 28 апреля 2018 в 09:46
Да, конечно. но тогда this.response должен быть массив.
Raman ответил: 28 апреля 2018 в 09:46
можете ли вы разместить код, как использовать NgFor с этим. Я буду очень благодарен за вас
Sangwin Gawande ответил: 28 апреля 2018 в 09:47
this.response должен быть массив, не так ли?
Raman ответил: 28 апреля 2018 в 09:48
Я попробую. Большое вам спасибо, сэр
bugs ответил: 28 апреля 2018 в 09:29

На пути subscribe не влияет, где вы размещаете console.log. Причина, по которой вы это испытываете, связана с асинхронным характером операции, выполняемой кодом.

getCategory() - это функция, которая обертывает http-вызов, поэтому вам необходимо подписаться к возвращаемому значению. Подписывание по существу означает:

Идите и выполните любую операцию, которую вам нужно выполнить, когда вы закончите, выполните материал, который находится внутри блока подписки. Но пока я жду, продолжайте с остальной частью кода

Следовательно, размещение console.log вне подписки означает, что он будет выполнен до завершения асинхронной операции.

Raman ответил: 28 апреля 2018 в 09:35
можете ли вы предоставить решение для решения этой проблемы?
bugs ответил: 28 апреля 2018 в 09:35
Просто разместите консольный журнал внутри подписки
M3enjamin ответил: 28 апреля 2018 в 09:32

Функция http.post () является асинхронной. Вы выполняете функцию post, а затем переходите к следующему утверждению. И только когда сервер отвечает, вы вводите функцию обратного вызова, переданную в вашу функцию http.post (). В первом случае вы выполняете оператор console.log, когда получаете ответ от сервера. Во втором случае, ваш console.log () будет выполнен сразу после выполнения HTTP-вызова, но прежде чем вы получите ответ от сервера.