AngularJS course is broken in free version

platform_issue

#1

The first exercise in this course works without issue, but move on to the second course, and the angular portion of the app seems to break entirely. Move further along, and it doesn’t get any better. I’ve tried to progress through it regardless, but I don’t feel like I’m learning as I can’t see the results of what I’m doing. I’m just being told that it’s correct or not, and I have no option to play with the code to tweak it or break it.

Here is a screenshot of the end of module 3. In this screenshot, I have accepted the provided solution from CodeCademy:

As you can see, none of the AngularJS options are being shown. The data is not being loaded.

This happens across multiple browser and across multiple computers on different networks. I have tried 4 machines on 5 separate networks, and have experienced this problem on all of them. I even attempted to reset my progress in the course thinking that might be the issue, but the problem persists.

Course can be found here: https://www.codecademy.com/courses/learn-angularjs/lessons/services/exercises/services-generalizations


#2

Please include a link to the exercise in question so the team can have a look.


#3

https://www.codecademy.com/courses/learn-angularjs/lessons/services/exercises/services-generalizations


#5

This is still ongoing.


#6

Can we see all your source code, please.

index.html
js/app.js
js/controllers/MainController.js
js/services/forecast.js

#7

index.html:

<!doctype html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="http://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css" rel="stylesheet" />
    <link href="css/main.css" rel="stylesheet" />
    
    <!-- Include the AngularJS library -->
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
  </head>
  <body ng-app="ForecastApp">

    <div class="main" ng-controller="MainController">
      <div class="container">
        <div class="row">
          <div class="col-sm-5 col-sm-offset-7">
            <h1>{{ fiveDay.city_name }}</h1>
            <h2>5-day forecast</h2>
            <div class="forecast" ng-repeat="day in fiveDay.days">
              <div class="day row">
                <div class="weekday col-md-4">
                  <p>{{ day.datetime | date }}</p>
                </div>
                <div class="weather col-md-3">
                  <img ng-src="{{ day.icon }}">
                </div>
                <div class="weather col-md-1">
                </div>
                <div class="high col-md-2">
                  <p>{{ day.high }}&deg;</p>
                </div>
                <div class="low col-md-2">
                  <p>{{ day.low }}&deg;</p>
                </div>
              </div>
            </div>
          </div>
        </div>
        </ul>
      </div>
    </div>

    <!-- Modules -->
    <script src="js/app.js"></script>

    <!-- Controllers -->
    <script src="js/controllers/MainController.js"></script>

    <!-- Services -->
    <script src="js/services/forecast.js"></script>

    <!-- Directives -->


  </body>
</html>

js/app.js (I feel like this is probably the problem):

var app = angular.module('ForecastApp', []);

js/controllers/MainController.js:

app.controller('MainController', ['$scope', 'forecast', function($scope, forecast) {
  forecast.success(function(data) {
    $scope.fiveDay = data;
  });
}]);

js/services/forecast.js:

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


#8

I am having the same problem, and the reason is (if you look in the console) that we are trying to access the json data from AWS which is on a different server, so it is triggering a 403 forbidden error. I think codecademy needs to enable CORS for this.


#9

Code looks alright as fas as I can see, so the issue must be with the platform.


#10

Hey @confuciusdragon would you mind sending this info over to our customer support team so that they can help you out?

https://help.codecademy.com/hc/en-us/requests/new


#11

Request submitted. Thanks!


#12

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.