Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free.

I am trying to GET from Wattpad.com's API level 3, http://www.wattpad.com/api/v3/stories/, using

Service

angular.module('myApp')
  .service('WattpadService', function WattpadService($resource) {
      var resource = $resource('http://www.wattpad.com/api/v3/stories', {}, {
        query: {method:'GET',
                params:{query:'margaretatwood'},
                isArray:false
                 }   
      }); 
      return {
        loadStories: function() {
          return resource.query();
        }   
      };  
  }); 

Controller

angular.module('myApp')
  .controller('MainCtrl', function ($scope, WattpadService, $resource) {
    WattpadService.loadStories()
    .$promise.then(
      function(data) {
        console.log("success");
        console.log(data);
      },  
      function(response) {
        console.log(response);
      }   
    );  

});

The data I get back is from console.log is super strange:

Resource
0: "a"
1: "r"
2: "r"
3: "a"
4: "y"
5: " "
6: "("
7: "↵"
(etc)

As far as I can tell, I'm experiencing the problem described at http://mariuszprzydatek.com/2013/12/13/tricky-behavior-of-angularjs-resource-service/. Using transformResponse like:

query: {method:'GET',
    params:{query:'margaretatwood'},
    isArray:false,
    transformResponse: function(data, headers){
    return JSON.parse(data);
    }
} 

Gets me

SyntaxError: Unexpected token a
    at Object.parse (native)

Any advice?

EDIT console.log of data before it's parsed (using a random user with only 1 story instead of Atwood who has a lot.)

array (
  'stories' => 
  array (
    0 => 
    array (
      'id' => '18265912',
      'title' => 'A Little Something Different',
      'length' => 9370,
      'createDate' => '2014-06-23T21:48:55Z',
      'modifyDate' => '2014-07-15T18:24:45Z',
      'voteCount' => 20,
      'readCount' => 153,
      'commentCount' => 4,
      'language' => 
      array (
        'id' => 1,
        'name' => 'English',
      ),
      'user' => 
      array (
        'name' => 'iamsandyhall',
        'avatar' => 'http://a.wattpad.com/useravatar/iamsandyhall.128.340656.jpg',
      ),
      'description' => 'Lea and Gabe are in the same creative writing class. They get the same pop culture references, order the same Chinese food, and hang out in the same places. Unfortunately, Lea is reserved, Gabe has issues, and despite their initial mutual crush, it looks like they are never going to work things out.

But somehow even when nothing is going on, something is happening between them, and everyone can see it. Their creative writing teacher pushes them together. The baristas at the local Starbucks watch their relationship like a TV show. Their bus driver tells his wife about them. The waitress at the diner automatically seats them together. Even the squirrel who lives on the college green believes in their relationship.',
      'cover' => 'http://a.wattpad.com/cover/18265912-256-k534988.jpg',
      'completed' => false,
      'categories' => 
      array (
        0 => 1,
        1 => 4,
      ),
      'tags' => 
      array (
        0 => 'adult',
        1 => 'contemporary',
        2 => 'reads',
        3 => 'swoon',
        4 => 'swoonworthy',
        5 => 'young',
      ),
      'rating' => 3,
      'copyright' => 1,
      'url' => 'http://www.wattpad.com/story/18265912-a-little-something-different',
      'firstPartId' => 56140494,
      'numParts' => 3,
      'parts' => 
      array (
        0 => 
        array (
          'id' => 56140494,
          'title' => 'A Little Something Different (September and October)',
          'draft' => false,
          'modifyDate' => '2014-07-14T19:45:12Z',
          'length' => 723,
          'videoId' => '',
          'photoUrl' => '',
          'commentCount' => 1,
          'voteCount' => 6,
          'readCount' => '91',
        ),
        1 => 
        array (
          'id' => 56140699,
          'title' => 'September (Maribel - Lea\'s roommate)',
          'draft' => false,
          'modifyDate' => '2014-07-14T19:48:02Z',
          'length' => 2611,
          'videoId' => '',
          'photoUrl' => '',
          'commentCount' => 0,
          'voteCount' => 6,
          'readCount' => '37',
        ),
        2 => 
        array (
          'id' => 56140763,
          'title' => 'September (Inga - creative writing professor)',
          'draft' => false,
          'modifyDate' => '2014-07-15T18:21:20Z',
          'length' => 6036,
          'videoId' => '',
          'photoUrl' => '',
          'commentCount' => 3,
          'voteCount' => 8,
          'readCount' => '27',
        ),
      ),
      'deleted' => false,
    ),
  ),
  'total' => 1,
  'categories' => 
  array (
    0 => 
    array (
      'id' => 4,
      'name' => 'Romance',
      'count' => 1,
    ),
    1 => 
    array (
      'id' => 1,
      'name' => 'Teen Fiction',
      'count' => 1,
    ),
  ),
  'tags' => 
  array (
  ),
)

typeof(data) returns string

oh - seems to be a php array

share|improve this question

4 Answers 4

Can you show the console.log of the data before it is parsed ?

Angular's JSON format is sometimes different from the native javascript's json formats, you might want to try to use angular.fromJson instead of JSON.parse.

share|improve this answer
    
I've edited the post above with the console.log of the data before it's parsed. The format does look different. Returning angular.fromJson(data) gives SyntaxError: Unexpected token a at Object.parse (native) at Object.fromJson –  Christine Jul 16 '14 at 14:46
response already parsed so you no need to parse again. try to return data instead parsing ,   

query: {method:'GET',
        params:{query:'margaretatwood'},
        isArray:false,
        transformResponse: function(data, headers){
        return data;
        }
} 

still if you want to parse,use angular json conversion methods

angular.toJson() angular.fromJson()

share|improve this answer
    
Thanks, I've tried that - gives the same result as not using transformResponse at all...I've updated the post above with the console.log of the data transformResponse receives. –  Christine Jul 16 '14 at 16:09
up vote 0 down vote accepted

Turns out I was getting a php array from the response. Fixed by setting

headers: {
  'Accept': 'application/json'
}

Thanks to DavidLin for helping me figure it out!

share|improve this answer

Resource 0: "f" 1: "a" 2: "l" 3: "s" 4: "e"

This finally worked for me:

transformResponse: function (data, headersGetter) {
return { isCorrect: angular.fromJson(data) }
}
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.