This page was moved to https://cwiki.apache.org/confluence/display/CAUSEWAY/Idiomatic AngularJS Support
Click in the link above if you are not automatically redirected in 10 seconds.


What is this?

Enable Isis' Restful Objects to be used in AngularJS in an idiomatic fashion:

  • two-way binding of simple data structures into $scope
  • support for third-party UI widget components
  • enable the full power of Restful Objects without getting in the way for simpler use cases.

Example UI widget components to support:

- angular-ui.github.io/bootstrap

- angular xeditable

"$spiroResource"

After some prototyping, we believe we could support such tools by providing a "drop-in" replacement for Angular's $resource.  Since this will build on Naked Objects Group's Spiro library, provisionally calling this $spiroResource.

v0.1 of the spec attached:  

                             spiroResource spec v0.1.txt 


THE REMAINDER OF THIS DOC SKETCHES OUT A SIMPLE REST API...

 ... showing "flattened" representations for simple binding.  $spiroResource accomplishes the same thing, but is much more powerful / require far less boilerplate than even using a simple REST API.

 

Assuming:

@RestAlias("todos")
public class ToDoItem {
  public String getDescription() { ... }
  public void setDescription(String d) { ... }
 
  @Optional
  public ToDo getDependsUpon() { ... }
  public void setDependsUpon(ToDoItem tdi) { ... }
 
  public Collection<ToDoItem> getRelatedTo() { ... }
}

Object Collection

http://localhost:8080/:objectType

eg: http://localhost:8080/todos

Supports:

  • GET
  • POST

Object Resource

http://localhost:8080/:objectType/:id

eg: http://localhost:8080/todos/4

Supports:

  • GET
  • DELETE
  • POST
  • PUT? or PATCH (but perhaps do put/post should behave like patch)

 

Headers ??:

 

LINK: ...? "relatedTo"

Representation:

{
  "description": "Buy bread",
  "status": "notComplete"
  "dependUpons": [ "href": "http://.../todos/3" }
  "dependencies": { "href": "http://...todos/4/dependencies" }
}
 

Or if eagerly resolved:

{ 
  ...
  "dependUpons": { "id": 3, ... and other scalar properties... }
  "dependencies": [ { "id": 4, ... }, { "id": 5, ... }, { "id": 6, ... } ]
}

 

Property Resource

http://localhost:8080/:objectType/:id/:property

eg: http://localhost:8080/todos/1/description

Methods:

  • GET
  • PUT
  • DELETE (question)

Representation:

{ "description": "foo" }

 

Collection Resource (query)

http://localhost:8080/:objectType/:id/:collection?offset=:offset&limit=:limit

eg: http://localhost:8080/todos/1/dependencies

Methods:

  • GET

Response Headers

LINK: next
LINK: prev

Representation

[
 { "href": ... },
 { "href": ... },
 { "href": ... }
]

or eagerly resolved:

[
 { "id": 4, ... },
 { "id": 5, ... },
 { "id": 6, ... }
]
would presumably need some sort of hint to indicate whether to eagerly resolve

Collection Resource (update)

http://localhost:8080/:objectType/:id/:collection

Methods:

  • POST 200 (put) or 
  • 201 (post)

 

Collection Element Resource

(not mandatory)

http://localhost:8080/:objectType/:id/:collection/:id GET, PUT, POST, DELETE

eg: http://localhost:8080/todos/1/dependencies/1

Representation

  • same repr as Object Resource repr

 

Action Resource

http://localhost:8080/:objectType/:id/:action

eg: http://localhost:8080/todos/1/addAddress

Methods:

  • GET - prompt info
  • POST - invoke

 

Action Parameter Resource

http://localhost:8080/:objectType/:id/:action/:actionParamName

eg http://localhost:8080/todos/1/addAddress/location GET

Representation:

{ id: 123 value: Foo }

 

Other ideas:

  • perhaps support OPTIONS

  • No labels