ng-hyper

Examples

hyper-basic

Template
<div data-hyper=".users">
  <pre data-ng-bind="users | json"></pre>
</div>
API
{
  "users": [
    {"name": "Cameron"},
    {"name": "Tim"},
    {"name": "Mike"}
  ]
}
Result












hyper-deep






  
Template


<div data-hyper=".users">
  <div data-hyper="user.name" data-ng-repeat="user in users">
    <span data-ng-bind="name"></span> is friends with:
    <ul data-hyper="user.friends">
      <li data-ng-repeat="friend in friends" data-hyper="friend.name" data-ng-bind="name"></li>
    </ul>
  </div>
</div>







  
API


{
  "href": "/api.json",
  "users": {
    "href": "/api/users.json"
  }
}
---
{
  "href": "/api/users.json",
  "data": [
    {"href": "/api/users/1.json"},
    {"href": "/api/users/2.json"},
    {"href": "/api/users/3.json"}
  ]
}
---
{
  "href": "/api/users/1.json",
  "name": "Cameron",
  "friends": {
     "href": "/api/users/1/friends.json"
   }
}
---
{
  "href": "/api/users/1/friends.json",
  "data": [
    {"href": "/api/users/2.json"},
    {"href": "/api/users/3.json"}
  ]
}
---
{
  "href": "/api/users/2.json",
  "name": "Tim",
  "friends": {
     "href": "/api/users/2/friends.json"
   }
}
---
{
  "href": "/api/users/2/friends.json",
  "data": [
    {"href": "/api/users/1.json"},
    {"href": "/api/users/3.json"}
  ]
}
---
{
  "href": "/api/users/3.json",
  "name": "Mike",
  "friends": {
     "href": "/api/users/3/friends.json"
   }
}
---
{
  "href": "/api/users/3/friends.json",
  "data": [
    {"href": "/api/users/1.json"},
    {"href": "/api/users/2.json"}
  ]
}







  
Result



  

     is friends with:
    
    
      
  •