title: Getting http.get data into local JSON array variable
body: <p>I am very new to Angular and Nodejs and thought this would be a fun project to try. I am trying to get the the json data from the <code>http.get</code> in angular.js and put it into a variable cities so it can display on the google maps. </p>
  
  <p>When I try to <code>console.log(cities);</code> it returns an object but <code>console.log(cities.items)</code> returns and undefined;</p>
  
  <p>When i try to see the if i can <code>JSON.stringify</code> the data inside the <code>$http.get</code> it display the data below which is what i am trying to accomplish. Is there another way to get this data into the var cities so i can use it as shown below?</p>
  
  <pre><code>    {
        "city": "New York",
        "state": "NY",
        "desc": "Google NYC",
        "lat": 40.7418,
        "long": -74.0045
      }
  </code></pre>
  
  <p>Any help is greatly appreicated</p>
  
  <p>angular.js</p>
  
  <pre><code>//Angular App Module and Controller
  var sampleApp = angular.module('mapsApp', []);
  
     var cities = $http.get('/locations').success(function (data){
      $scope.items = data.items;
      })
  
      var mapOptions = {
          zoom: 8,
          center: new google.maps.LatLng(41.5, -73),
          mapTypeId: google.maps.MapTypeId.TERRAIN
      }
  
      $scope.map = new google.maps.Map(document.getElementById('map'), mapOptions);
  
      $scope.markers = [];
  
      var infoWindow = new google.maps.InfoWindow();
  
      var createMarker = function (info) {
  
          var marker = new google.maps.Marker({
              map: $scope.map,
              position: new google.maps.LatLng(info.lat, info.long),
              title: info.city
          });
          marker.content = '&lt;div class="infoWindowContent"&gt;' + info.desc +          '&lt;/div&gt;';
  
          google.maps.event.addListener(marker, 'click', function () {
              infoWindow.setContent('&lt;h2&gt;' + marker.title + '&lt;/h2&gt;' + marker.content);
              infoWindow.open($scope.map, marker);
          });
          $scope.markers.push(marker);
      }
  
      for (i = 0; i &lt; cities.length; i++) {
          createMarker(cities[i]);
      }
      $scope.openInfoWindow = function (e, selectedMarker) {
          e.preventDefault();
          google.maps.event.trigger(selectedMarker, 'click');
      }
  });
  </code></pre>
  
  <p>googleMaps.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html ng-app="mapsApp"&gt;
  &lt;head&gt;
      &lt;meta charset="ISO-8859-1"&gt;
      &lt;title&gt;Insert title here&lt;/title&gt;
      &lt;link rel="stylesheet" href="css/maps.css"&gt;
      &lt;script            src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"&gt;    &lt;/script&gt;
      &lt;script
              src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;language=en"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/maps.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div ng-controller="MapCtrl"&gt;
      &lt;div id="map"&gt;&lt;/div&gt;
      &lt;div id="repeat" ng-repeat="marker in markers | orderBy : 'title'"&gt;
          &lt;a id="country_container" href="#" ng-click="openInfoWindow($event, marker)"&gt;
              &lt;label id="names" &gt;{{marker.title}}&lt;/label&gt;&lt;/a&gt;
      &lt;/div&gt;
      &lt;ul&gt;
          &lt;li ng-repeat="item in items"&gt;
              {{item}}
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>app.js</p>
  
  <pre><code>//Rest HTTP stuff
  var express = require('express');
  var bodyParser = require('body-parser');
  var dbGoogle = require('./dbGoogle');
  var app = express();
  
  // configure body parser
  app.use(bodyParser.urlencoded({extended: true}));
  app.use(bodyParser.json());
  
  var port = process.env.PORT || 8080; // set our port
  
  // create our router
  var router = express.Router();
  
  // middleware to use for all requests
  router.use(function (req, res, next) {
      // do logging
  console.log('Incoming request..');
  next();
  });
  
  // test route to make sure everything is working
  router.get('/', function (req, res) {
  res.json({message: 'Welcome!'});
  });
  router.route('/locations')
  
  // get all the locations
  .get(function (req, res) {
          dbGoogle.getGoogles(function (err, data) {
              if (data) {
                  res.json({
                      status: '200',
                      items: data
                 });
              } else {
                 res.json(404, {status: err});
             }
          });
      })
  // Register routes
  app.use('', router);
  
  //Serve static content files
  app.use(express.static('public'));
  
  // START THE SERVER
  app.listen(port);
  console.log('Running on port ' + port);
  </code></pre>
  
  <p>db.js</p>
  
  <pre><code>var mysql = require('mysql');
  var app = require('./app.js');
  
  var pool = mysql.createPool ({
      host: 'localhost',
      user: 'root',
      port: 3306,
      password: 'password',
      database: 'testdb'
  });
  
  module.exports.pool = pool;
  
  pool.getConnection(function(err){
      if(!err) {
          console.log("Database is connected\n\n");
      } else {
          console.log(err);
      }
  });
  </code></pre>
  
  <p>dbGoogle.js</p>
  
  <pre><code>var db = require('./db.js');
  
  var getGoogles = function getGoogles(callback) {
      db.pool.getConnection(function (err, connection) {
          // Use the connection
          connection.query('SELECT * FROM locations', function(err, results){
              if (!err) {
                  if (results != null) {
                      callback(null, results);
                  } else {
                      callback(err, null);
                  }
              } else {
                  callback(err, null);
              }
              //release
              connection.release();
          });
  
      });
  }
  
  module.exports.getGoogles = getGoogles;
  </code></pre>