Im stuck and would like help please. Nothing is showing up once I open it in the browser


#1

index.html

<!DOCTYPE html>
<html>
<head>
	<title>Suggestion Box</title>
	<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/
css/bootstrap.min.css" rel="stylesheet">
	<script type="text/javascript" src="js/vendor/angular.min.js"></script>
	<script src="https://code.angularjs.org/1.2.28/angular-route.min.js"></script>
</head>
<body ng-app="SuggestionBox" ng-controller="HomeController">
	<div class="container">
		<div ng-view></div>
	</div>

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

	<!-- Controllers -->
	<script type="text/javascript" src="js/controllers/HomeController.js"></script>

	<!-- Services -->
	<script type="text/javascript" src="js/services/suggestion.js"></script>
</body>
</html>

app.js

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

HomeController

app.controller('HomeController', ['$scope','suggestions', function($scope, suggestions) {
	$scope.posts= suggestions.posts
	$scope.addSuggestion = function() {
		if(!$scope.title || $scope.title === "") {
			return;
		}
		$scope.posts.push({
			title: $scope.title,
			upvotes: 0,
		});
		$scope.title = '';
	};
	$scope.upVote =function(x) {
    	x.upvotes +=1;
  };
}]);
}]);

suggestions.js

 app.factory('suggestions', [ function(){
 	var mySuggestions = {
 		posts: [
 		{
 			title: "Cupcakes at club meetings",
 			upvotes: 10,
 			comments:[],
 		},
 		{
 			title: "End all club meetings with a cool chant",
 			upvotes: 20,
 			comments: [],
 		},
 		{
 			title: "Water fountain with Gatorade",
 			upvotes: 7,
 			comments: [],
 		},
 		{
 			title: "Sing Beyonce songs during intermission",
 			upvotes: 6,
 			comments: [],
 		}
 		]
 	};
	return mySuggestions;
 }]);

home.html

<div class="main">
	<div class="container">
		<div class="col-md-6" ng-repeat="post in posts">
			<p class="title"> {{ posts.title }}></p>
			<p class="upvotes"> {{posts.upvotes}}></p>
		</div>
	</div>
</div>

#2

There is only one array. Looks a duplicate.


#3

I fixed it but nothing is still showing in the browser


#4

May we have a link to the exercise, please? Thanks.


#5

here is the link to the exercise

https://www.codecademy.com/final_project/learn-angularjs


#6

Are you doing this on your own computer? Do you have angularjs in a local folder?

To ensure it is not the problem, go to the CDN and copy the link to the min.js file and use that URL so you know you have an official copy of angular.min.js.

Your code looks correct as near as I can tell. I haven't done this project yet so cannot really help any further. Sorry.


#8