Either I'm using the $resource incorrectly (most likely, just started with angular today) or my JSON is bad.
AngularJS fiddle: http://jsfiddle.net/8zVxH/1/ and relevant code:
angular.module('app', ['ngResource']);
function AppCtrl($scope, $resource) {
var url = 'http:,,api.petfinder.com,pet.getRandom;key=260f9e3a6f6670b5d9db68b281ebe7a9;format=json;location=51503';
$scope.petfinder = $resource('http://jsonproxy.aws.af.cm/proxy/:action',
{action:url, callback:'JSON_CALLBACK'},
{get: {method:'JSONP'}});
$scope.indexResult = $scope.petfinder.get();
}
jQuery Fiddle:http://jsfiddle.net/78Cab/ and relevant code
$.ajax({
url: 'http://jsonproxy.aws.af.cm/proxy/http:,,api.petfinder.com,pet.getRandom;key=260f9e3a6f6670b5d9db68b281ebe7a9;format=json;location=51503',
method: 'GET'
}).done(function (data) {
console.log(data);
});
the jQuery fiddle works hitting the same URL..
Hitting this JSON URL http://jsonproxy.aws.af.cm/proxy/http:,,api.petfinder.com,pet.getRandom;key=260f9e3a6f6670b5d9db68b281ebe7a9;format=json;location=51503 which passes http://jsonlint.com/ as valid JSON
Anyone else have a similar issue?
I figured it out. Even though the service was returning valid JSON, the $resource call was expecting JSONP and wasn't smart enough to use plan JSON. I had to modify the service to return callback(JSON) instead of just JSON.