{"id":1815,"date":"2022-08-30T15:19:40","date_gmt":"2022-08-30T15:19:40","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2013\/12\/02\/angularjs-and-ngresouce-whats-the-magic-collection-of-common-programming-errors\/"},"modified":"2022-08-30T15:19:40","modified_gmt":"2022-08-30T15:19:40","slug":"angularjs-and-ngresouce-whats-the-magic-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2022\/08\/30\/angularjs-and-ngresouce-whats-the-magic-collection-of-common-programming-errors\/","title":{"rendered":"AngularJS and ngResouce, what's the magic?-Collection of common programming errors"},"content":{"rendered":"

I’m working currently on RESTful AngularJS $resource feature. I really don’t get all of the feature, even with examples provided by Angular Documentation or Stackoverflow similar subjects.<\/p>\n

My usecase is simple :<\/p>\n

1) I have a html list, fed with a json file. 2) I change the order via jQuery ui sortable 3) after changing, I would like the server to save the new position of each item of the list.<\/p>\n

First and second steps are done : I can read a $resource that looks like this :<\/p>\n

 function DndCtrl($scope, $resource) {\n   var feed = $resource('\/users\/'+ userId +'\/test.json');\n   $scope.tests = feed.query();\n }\n<\/code><\/pre>\n
json file returns items with position and a description.<\/p>\n
and display it via html classical Angular call :<\/p>\n
   \n     \n      \n      \n     \n  \n<\/code><\/pre>\n
When ordering via ui.sortable, I can manage to look at the change with $index+1<\/p>\n
But here’s the last step : how to save the change on server after sorting items ?<\/p>\n
I tried this basic thing :<\/p>\n
function update(index) {\n var ch = feed.get({id: index});\n ch.position = index+1;\n ch.$save();\n}\n$scope.updateSortable = {\n update: function(e, ui) {\n   update(ui.item.index());\n },\n placeholder: \"xp-hightlight\",\n axis: 'y'\n};\n<\/code><\/pre>\n
Error I have with this is:<\/p>\n
TypeError: Object # has no method 'push'\n<\/code><\/pre>\n
I probably miss a logical thing somewhere but as I’m not yet at ease with RESTful model, I don’t know exactly what I did wrong \ud83d\ude42<\/p>\n
UPDATE<\/p>\n
I just wanted to add a detail about json urls : the read list is available with this route :<\/p>\n
 \/users\/:userId\/tests (GET)\n<\/code><\/pre>\n
But each item is available at this route :<\/p>\n
 \/users\/:userId\/tests\/:id   (PUT, DELETE)\n<\/code><\/pre>\n
Of course, in the get method, if I try to catch the second syntax, it returns a 404 Not Found.<\/p>\n
SECOND UPDATE :<\/p>\n
I tried to modify the call method with this :<\/p>\n
function DndCtrl :<\/p>\n
 var feed = $resource('\/users\/'+ userId +'\/tests\/:id', {'update': {method:\"PUT\", isArray:true}});\n<\/code><\/pre>\n
and in update function :<\/p>\n
 var t=$scope.test[index].id;\n var ch = feed.get({id:t});\n ch.position = index+1;\n ch.$update();\n<\/code><\/pre>\n
It returns :<\/p>\n
 Uncaught TypeError: Object # has no method '$update' controller.js?body=1:11\n GET http:\/\/rooturl\/users\/1\/tests\/20?update=%5Bobject+Object%5D 404 (Not Found) \n<\/code><\/pre>\n
Originally posted 2013-12-02 01:41:00. <\/small><\/p>","protected":false},"excerpt":{"rendered":"
I’m working currently on RESTful AngularJS $resource feature. I really don’t get all of the feature, even with examples provided by Angular Documentation or Stackoverflow similar subjects. My usecase is simple : 1) I have a html list, fed with a json file. 2) I change the order via jQuery ui sortable 3) after changing, […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1815","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1815","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=1815"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1815\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=1815"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=1815"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=1815"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}