将对象从节点传递到前端

时间:2019-02-23 22:57:58

标签: javascript

我似乎无法使用node将数组传递到前端(javascript)。

我正在将mysql数据库中的国家/地区名称传递给.geocode调用。但是目前,我似乎无法将整个内容附加到数组/对象中,然后将其传递给render方法以在前端显示。它总是空的。

Js

//route for homepage
app.get('/', (req, res) => {

  let sql = "SELECT country_name from countries";
  let query = conn.query(sql, (err, results) => {
    if (err) throw err;


    for (i = 0; i < results.length; i++) {
      geoLoc = []

      const promises = results.map(result => new Promise(function(resolve, reject) {
        geo.geocode('mapbox.places', result.Country_Name, function (err, geoData) {
          if(err) reject()
          if(geoData){
            resolve(geoData.features[0])
          };
        });
      }))

      Promise.all(promises).then((geoLoc) => {
        res.render('layouts/layout', {
          results: geoLoc
        });
      })


  }

  });
});

第一个控制台

[ { id: 'country.11971821457735890',
    type: 'Feature',
    place_type: [ 'country' ],
    relevance: 1,
    properties: { short_code: 'bj', wikidata: 'Q962' },
    text: 'Benin',
    place_name: 'Benin',
    bbox: [ 0.776667, 6.13014, 3.843051, 12.408444 ],
    center: [ 2.18333, 8.83333 ],
    geometry: { type: 'Point', coordinates: [Array] } },
  { id: 'country.8605848117814600',
    type: 'Feature',
    place_type: [ 'country' ],
    relevance: 1,
    properties: { short_code: 'gb', wikidata: 'Q145' },
    text: 'United Kingdom',
    place_name: 'United Kingdom',
    bbox: [ -8.718659, 49.802665, 1.867399, 60.945453 ],
    center: [ -2, 54 ],
    geometry: { type: 'Point', coordinates: [Array] } } ]

第二个控制台仅显示一个空数组。

3 个答案:

答案 0 :(得分:1)

编辑:

您的res.render()需要等待,直到geoLoc累积为止。 您可以尝试@Sayegh或回调建议的Promise。

您甚至可以使用类似的方法,但是Promise或callback将是合适的选择

geo.geocode("mapbox.places", results[i].Country_Name, function(err, geoData) {
    if (geoData) {
        geoLoc.push(geoData.features[0]);
        console.log(geoLoc);
    }
});

if(geoLoc){
    res.render('layouts/layout', {
      results: geoLoc
    });
}

答案 1 :(得分:1)

问题是geocode函数是异步的,并且在那个时间点使用空数组调用render函数后,地址解析函数将调用其回调。

您需要等待所有请求完成,然后致电res.render

兑现承诺也容易得多。

app.get('/', (req, res) => {
  let sql = "SELECT country_name from countries";
  conn.query(sql, (err, results) => {
    if (err) throw err;
    const promises = results.map(result => new Promise(function(resolve, reject) {
      geo.geocode('mapbox.places', result.Country_Name, function (err, geoData) {
        if(err) reject()
        if(geoData){
          resolve(geoData.features[0])
        };
      });
    }))
    Promise.all(promises).then((geoLoc) => {
      res.render('layouts/layout', {
        results: geoLoc
      });
    })
  });
});

答案 2 :(得分:0)

调用是异步的,因此可以在回调内部访问geoLoc。

fib 1024