1

I'm a novice attempting to use Angular JS to read Kickstarter json data and display it on a page.

I have a code pen showing the basic code I'm using with a working sample data source, and then a not working example with the kick-starter source.

http://codepen.io/anon/pen/KmCsc

HTML

<div ng-app>
<div ng-controller="recent">
<p>First Project ID: {{kickstarter.projects[0].id}}</p>
<p>Total hits: {{kickstarter.total_hits}}</p>
</div>
</div>

Javascript

function recent($scope, $http) {
$http.get('https://www.kickstarter.com/discover/recently-launched?format=json').
success(function(data) {
$scope.kickstarter = data;
});
}

I might be making a mistake in how I reference the variable, I've been banging my head against a wall for several hours and can't see it. Your expertise is greatly appreciated.

For reference Kickstarter recent project data is available in json format here: https://www.kickstarter.com/discover/recently-launched?format=json

Thanks in advance for your help.

user2644168
  • 13
  • 2

1 Answers1

1

Your example works. You are sending the request and the model binding should work. However, if you look in the console you are getting the following error message: XMLHttpRequest cannot load https://www.kickstarter.com/discover/recently-launched?format=json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.

Take a look at this answer

Community
  • 1
  • 1
boindiil
  • 5,805
  • 1
  • 28
  • 31