Пустой ответ в Angular 4 из бэкэнда Java

Я новичок в Angular, и у меня возникла проблема. Я хочу получить данные для моего графика из моего бэкэнда весенней загрузки. Я отправляю запрос GET из своего приложения Angular и получаю пустой ответ, несмотря на то, что в консоли вижу, что он не пустой. Не могли бы вы помочь мне?

Мой угловой сервис

getChartData(): Observable<Array<ChartDataParameters>> {
  return this.http.get<Array<ChartDataParameters>> ('http://127.0.0.1:8080/currency/chartData');
}

и мой компонент, который использует этот метод

this.databaseService.getChartData().subscribe(d => {
  this.data_origin = d;
});

for (let i = 0; i < this.data_origin.length; i++) {
  this.data.push([this.data_origin[i].date, this.data_origin[i].prediction, this.data_origin[i].currency]);
}

Пустой ответ в Angular 4 из бэкэнда Java

Пустой ответ в Angular 4 из бэкэнда Java

Вы используете Http или HttpClient?

SiddAjmera 01.09.2018 11:55
getChartData асинхронный. Вы пытаетесь прочитать значение до того, как оно будет установлено в подписке.
user184994 01.09.2018 11:56

я использую HttpClient

akaoD 01.09.2018 12:14
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
1
3
269
2

Ответы 2

Вы должны использовать свои данные внутри Subscription. Кроме того, вам действительно не нужно создавать так много переменных для данных, которые вы пытаетесь использовать.

this.databaseService.getChartData().subscribe(d => {
  this.data_origin = d;
});

for (let i = 0; i < this.data_origin.length; i++) {
  this.data.push([this.data_origin[i].date, this.data_origin[i].prediction, this.data_origin[i].currency]);
}

должно быть

this.databaseService.getChartData().subscribe(d => {

  for (let i = 0; i < d.length; i++) {
    this.data.push([d[i].date, d[i].prediction, d[i].currency]);
  }

});

Кроме того, я думаю, что что-то не так с тем, что вы здесь делаете. Предполагается, что данные представляют собой массив объектов, каждый из которых содержит три ключа: date, prediction и currency?

Если это так, я думаю, вы можете свести логику только к следующему:

this.databaseService.getChartData().subscribe(d => {

  this.data = d.map(datum => { date: datum.date, prediction: datum.prediction, currency: datum.currency })

});

переместить loop внутрь subscribe

this.databaseService.getChartData().subscribe(d => {
  for (let i = 0; i < d.length; i++) {
    this.data.push([d[i].date, d[i].prediction, d[i].currency]);
  }
});

Другие вопросы по теме