Resolved—
I’m leaving this post up for other people that may have the same issue. Ultimately the problem was that
<script src= 'js/services/places.js'></script>
wasn’t working because my file hierarchy was structured incorrectly.
I’ve spent days trying to figure this out to no avail! In the words of Bonnie Tyler: I need a hero.
Here is the error my console is logging:
VM361 angular.min.js:
102 Error: [$injector:unpr] http://errors.angularjs.org/1.3.15/$injector/unpr?p0=placesProvider%20<-%20places%20<-%20MainController
------Index -----
<!doctype html>
<html>
<head>
<!-- Include Stylesheets -->
<link href="https://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css" rel="stylesheet" />
<link href="css/leaflet.css" rel="stylesheet" />
<link href="css/main.css" rel="stylesheet" />
<!-- Include Scripts -->
<script src = 'js/vendor/angular.min.js'></script>
<script src = 'js/vendor/leaflet.js'></script>
<script src = 'js/vendor/angular-leaflet-directive.min.js'></script>
<script src = 'js/vendor/helpers.js'></script>
</head>
<body ng-app='NearMeApp'>
<div class="header">
<div class="container-fluid">
<h1 class="pull-left">NearMe</h1>
</div>
</div>
<div class="main" ng-controller='MainController'>
<div class="container-fluid" id="map-canvas">
<leaflet center = "mapCenter" markers = "mapMarkers"></leaflet>
</div>
</div>
<!-- Modules -->
<script src= 'js/app.js'></script>
<!-- Controllers -->
<script src= 'js/controllers/MainController.js'></script>
<!-- Directives -->
<!-- Services -->
<script src= 'js/services/places.js'></script>
</body>
</html>
----- app.js -----
var app = angular.module(‘NearMeApp’, [‘leaflet-directive’]);
----- MainController.js -----
app.controller(‘MainController’, [’$scope’, ‘places’, function($scope, places) {
places.success(function(data) {
$scope.geodata = data;
$scope.mapMarkers = geodataToMarkers($scope.geodata);
});
$scope.mapCenter =
{
lat: 40.741934,
lng: -74.004897,
zoom: 17
};
}]);
----- places.js -----
app.factory(‘places’, [’$http’, function($http) {
return $http.jsonp(‘https://en.wikipedia.org/w/api.php?action=query&list=geosearch&gsradius=5000&gscoord=40.741934|-74.004897&gslimit=30&format=json&callback=JSON_CALLBACK’)
.success(function(data) {
return data;
})
.error(function(err) {
return err;
});
}]);