Menu
I've been working on this for a few hours and can't seem to get anywhere. I hope this is the right place to post this. I'm new to StackOverflow so please guide me to the right place if this isn't correct.
I have the following html file:
<!DOCTYPE HTML>
<html ng-app="DishClips">
<head>
<script type="text/javascript" src="http://code.angularjs.org/angular-1.0.0.0rc4.min.js"></script>
<script type="text/javascript" src="http://code.angularjs.org/angular-resource-1.0.0.0rc4.min.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.0/css/bootstrap.min.css">
<script type="text/javascript" src="./dishclips.js"></script>
</head>
<body>
<div ng-controller="DishClipsCtrl">
<table class="table table-striped">
<tr ng-repeat="restaurant in dishclipsResult.results"></tr>
<td>{{restaurant.name}}</td>
</table>
</div>
</body>
</html>
And the following in my dishclips.js:
angular.module('DishClips', ['ngResource']);
function DishClipsCtrl($scope, $resource) {
$scope.dishclips = $resource('http://apiv2.dishclips.com/dishclips/api/:action',
{action:'searchRestaurants',address:'irvine',callback:'JSON_CALLBACK' },
{get:{method:'JSONP'}});
$scope.dishclipsResult = $scope.dishclips.get();
}
When I run this (in chrome) I get:
Uncaught SyntaxError: Unexpected token :
The json return looks great so I don't understand why this is an issue.
Thanks
768
Because the API you used returns JSON instead of JSONP. The JSONP's payload should be wrapped with a function like this functionCall({"Name": "Foo", "Id": 1234, "Rank": 7});
137
You must define one more default param in the JSONP request.
get:{method:'JSONP', params : {callback : 'JSON_CALLBACK'}}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
