How to use an angularjs resource for rails/RESTful routes?

Question

I've got an angularjs app embedded in a rails app. I'm using the RESTful methods provided by rails for a resource named "Task." Here are the routes I'm dealing with:

GET    /api/v1/tasks.json
POST   /api/v1/tasks.json
GET    /api/v1/tasks/:id.json
PUT    /api/v1/tasks/:id.json
DELETE /api/v1/tasks/:id.json

I've got an angularjs-resource for the Task item where the GET for all of the tasks works fine. (Code is in coffee script)

App.factory "Task", ["$resource", "$cookies", ($resource, $cookies) ->
  $resource "/api/v1/tasks:slash:type.json?api_token=:api_token",
    api_token: $cookies.api_token
    type: '@id'
  ,
    all:
      method: "GET"
      isArray: true

    create:
      method: "POST"

    update:
      method: "PUT"
      params:
        slash: "/"

    remove:
      method: "DELETE"

]

As you can sort of see here, I'm trying to insert a slash for the PUT method to get the format /api/v1/tasks/:id.json. Unfortunately, angular puts this in as a %2f rather than a slash. I'm not particularly excited about the quality of this code, since added the slash parameter makes it less readable.

Here's my angularjs controller using this resource:

taskController = App.controller 'TasksController', ($rootScope, $scope, $http, $cookies, Task)  ->
  $scope.message = $cookies.api_token  
  $scope.tasks = Task.all()
  $scope.selectedTask = null

  $scope.editTask = (task) ->
    $scope.selectedTask = task
    $scope.editDescription = task.description
    $rootScope.date = new Date(task.dueDate)
    console.log($rootScope.dt)
    $scope.taskModal = true

  $scope.saveTask = ->
    $scope.taskModal = false
    $scope.selectedTask.$update()
    # Task.update({taskID: $scope.selectedTask.id, task: $scope.selectedTask})
    console.log 'Implement saving...'
    $scope.tasks = Task.all()

  $scope.cancelTask = ->
    $scope.taskModal = false

  $scope.taskModalOptions = {
    dialogFade: true
  }

taskController.$inject = ['$rootScope', '$scope', '$http', '$cookies', 'Task']

Basically, my question is does anyone have an example of how do reproduce the traditional rails/RESTful URL formats with an angularjs resource? I've looked at several StackOverflow questions and can't seem to find a good answer. Any help is appreciated.

Answer 1

Have a look at restangular, its specifically designed to make HTTP verb requests to any REST api simple & easy.

https://github.com/mgonto/restangular