Блог

я попытался сделать свой собственный прогноз погоды. Я взял darksky для данных. Мой сервер является коротким node.js сервер с геоданными и частью прогноза.

Часть прогноза: …

 const request = require('request');

const forecast = (latitude, longitude, callback) => {
  const url =
   darksky url
  var weatherData = {};

  request({ url, json: true }, (error, { body }) => {
    if (error) {
      callback('Unable to connect to weather service', undefined);
    } else if (body.error) {
      callback('Unable to find location', undefined);
    } else {
      callback(
        undefined,
        (weatherData = {
          daily: body.daily.data[0].summary,
          temp: body.currently.temperature,
          regen: body.currently.precipProbability
        })
      );
    }
  });
};

module.exports = forecast;
  

…

сервер:

…

 const express = require('express');
const cors = require('cors');
const bodyParser = require('body-parser');

const geocode = require('./utils/geocode');
const forecast = require('./utils/forecast');

const app = express();
const port = process.env.PORT || 3000;

app.use(cors());
app.use(bodyParser.json());

app.get('/', (req, res) => {
    res.send('Hello World');
});

app.get('/weather', (req, res) => {
  console.log(req.query.search);
  geocode(req.query.search, (error, { latitude, longitude, location } = {}) => {
    if (error) {
        return res.send({ error });
    }

    forecast(latitude, longitude, (error, forecastData) => {
        if (error) {
            return res.send({ error });
        }
        const data =({
            location,
            forecast: forecastData
        });
        console.log(JSON.stringify(data));
        res.send(JSON.stringify(data));
    });
});
});


app.listen(port, () => {
  console.log("Server is up and running");
});
  

…

Теперь я пытаюсь получить это в своем приложении angular 7.

Я создал сервис:

…

  getDataServer(addy: string) {
    return this.http.get(this.url   addy).subscribe(responseData => {
      console.log(responseData);
    });
  }
  

…

Responsedata содержит всю необходимую информацию в этом формате:

{местоположение: Штутгарт, трансляция: { ежедневно: ‘sun’, регенерация: 0, температура: 17}}

Теперь я попытался получить прогноз в своем компоненте, но это не сработает. Я попытался создать Observable и подписаться, но ничего не сработало.

Может быть, у вас есть небольшая подсказка,

Спасибо,

Том

Пожалуйста, измените свой сервисный код следующим образом

 getDataServer(addy: string) {
    return this.http.get(this.url   addy).pipe(map(res => res.json()));
  }
  

И вызывайте эту службу в вашем компоненте как

 this.your_service_property.getDataServer(addy).subscribe(data => {
console.log(data);
// Try updating your html here
})
  

Спасибо, это была огромная помощь для меня. Я попробовал это почти таким же образом, но с вашей помощью я получил решение для службы, пришлось изменить его на:

 getDataServer(addy: string) {
    return this.http.get(this.url   addy).pipe(map(res => res));
  }
  

получено сообщение об ошибке от res.json(). HttpClient изменился, и я вернул объект json.

Следующая вещь в компоненте:

 this.your_service_property.getDataServer(addy).subscribe((data: any) => {
console.log(data);
  

Пришлось использовать любое свойство для данных. Без этого я всегда получал ошибку типа

Свойство ‘location’ не существует для типа ‘Object’, если бы я попытался получить какое-либо значение из data — data.location. Пробовал это с интерфейсом, но все равно ошибка, поэтому я выбрал самый простой способ с любым, и это сработало.

Но часть с интерфейсом все еще у меня в голове, и я попробую это позже.