Step 5 Won't show date


#1

The day.html template:

<!-- Format a date so it displays in the format "Friday 1/16" -->
<h2 class="date"> {{ day.date <!--| date:'EEEE, M/d'-->}} </h2>

<!--
TODO: Loop through events and display each one with this HTML
-->

<div class="event" ng-repeat='event in day.events'>
  <a href="#/{{$index}}">
    <h3 class="name"> {{event.name}} </h3>
    <p><span class="from"> {event.from} </span> - <span class="to"> {{ event.to }} </span></p>
  </a>
</div>

app.js:

var app = angular.module('CalendarApp', ['ngRoute']);
app.config(function($routeProvider) {
  $routeProvider
  .when('/', {
    controller: 'DayController',
    templateUrl: 'views/day.html'
  })
  .otherwise({
    redirectTo: '/'
  });
});

DayController.js:

 app.controller('DayController', ['$scope', 'events', function($scope, events) {
	events.success(function(data){
    $scope.events = data;
  });
}]);

events.js

app.factory('events', ['$http', function($http) {
  return $http.get('https://s3.amazonaws.com/codecademy-content/courses/ltp4/events-api/events.json')
  .success(function(data){
    return data;
  })
  .error(function(data) {
    return data;
  });
}]);

Any assistance is appreciated. No data shows. I have not added the date piping for the times because I don't want that to cause an error while error testing.


#2

Do you have the ng-app attribute set in your body tag in your html template?
<body ng-app="CalendarApp">


#3

Yes, that is default with the exercise.


#4

Ahh in DayController.js you should be setting
$scope.day = data; instead of $scope.events


#5

That helped a bit thank you.

Now the events show but the date still does not show.


#6

That and commenting out the '| date:' caused the date error. Thank you for the assistance.


#7

Error 1: After experimenting, inside of the {{}} you should NEVER have spaces or extra junk such <!-- -->. If you look at your output, it literally says{{ day.date }}` and note it prints out the spaces too. Not sure if both but at least it works now with the correct version below.

Incorrect: <h2 class="date"> {{ day.date <!--| date:'EEEE, M/d'--> }} </h2>

Correct: <h2 class="date"> {{day.date}} </h2>

Error 2: You are to use the curly brackets in pairs, {{}}, not singularly, {}.

Incorrect: <p><span class="from"> {event.from} </span>

Correct: <p><span class="from"> {{event.from}} </span>

I am using google chrome.