Data is not showing. Here is what I’ve done:
INDEX.JS
<!doctype html>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Roboto:400,300,700' rel='stylesheet' type='text/css'>
<link href="https://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css" rel="stylesheet" />
<link href="css/main.css" rel="stylesheet" />
<script src="js/vendor/angular.min.js"></script>
</head>
<body ng-app="OutboxApp">
<div class="header">
<div class="container">
<img src="img/logo.svg" width="140" height="150">
</div>
</div>
<div class="main" ng-controller="HomeController.js">
<div class="container">
<div class="email" ng-repeat="email in emails">
<span class="from"> {{email.from}}</span>
<span class="subject"> {{email.subject}}</span>
<span class="date"> {{email.datetime | date}} </span>
</div>
</div>
</div>
<!-- Modules -->
<script src="js/app.js"></script>
<!-- Controllers -->
<script src="js/controllers/HomeController.js"></script>
<!-- Services -->
<script src="js/services/emails.js"></script>
</body>
</html>
APP.JS
var app = angular.module("OutboxApp", []);
EMAILS.JS
app.factory('emails', ['$http', function($http) {
return $http.get('https://s3.amazonaws.com/codecademy-content/courses/ltp4/emails-api/emails.json')
.success(function(data) {
return data;
})
.error(function(err) {
return err;
});
}]);
HOMECONTROLLER.JS
app.controller('HomeController', ['$scope', 'emails', function($scope, emails) {
emails.success(function(data) {
$scope.emails = data;
});
}]);