ng-nested-resource

v0.0.0

Published

2 years ago

Wrap around angular resource that provides:

Downloads

0High
0Medium
0Low

vivifyideas

ng-nested-resource

Wrap around angular resource that provides:

nested resources
collection objects

Installation

Install package via bower:

bower install ng-nested-resource

Include javascript files in your project:

<!DOCTYPE html>
<html>
<head>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-resource/angular-resource.js"></script>
    <script src="bower_components/ng-nested-resource/dist/ng-nested-resource.js"></script>
</head>
<body ng-app="app">
...

Add ngNestedResource as a dependency to your app

angular.module("app", ["ngNestedResource"]);

Usage

There are two main factories that can be used for making your model and collection objects:

BaseModel
BaseCollection

BaseModel

wrap around ngResource
deals with nesting
provides api for basic usage:
get
list
count
store
update
save
destroy
clone
allows adding custom methods

Define models:

// User Model
angular.module('MyApp')
    .factory('UserModel', function(BaseModel) {
        var UserModel = BaseModel(
            '/users/:id',
            {
                id: '@id'
            },
            {
                posts: 'PostModel' // nesting array of PostModel-s
            }
        );

        return UserModel;
    });

// Post Model
angular.module('MyApp')
    .factory('PostModel', function(BaseModel) {
        var PostModel = BaseModel(
            '/posts/:id',
            {
                id: '@id'
            }
        );

        // custom methods
        PostModel.prototype.commentsAllowed = function () {
            return this.comments_allowed && this.is_published;
        };

        return PostModel;
    });

Use models:


// get user object
// this will generate GET request to `/users/1`
// if the returning object has `posts` array, all elements in that array will be PostModel objects
var user = UserModel.get({id: 1});

// access nested resource
if (user.posts[0].commentsAllowed()) {
    ...
}

// make new UseModel
var newUser = new UserModel({
    name: 'Misa Tumbas',
    team: 'Partizan BC',
    age: 50
});

// store
// sends POST request to `/users/`
newUser.store(success, error); // you can use also newUser.save()

// update
// sends PUT request to `/users/:id`
newUser.age = 51;
newUser.update(success, error); // you can use also newUser.save()

// destroy resource
// sends DELETE request to `/users/:id`
newUser.destroy();

// get list of resources
// sends GET request to `/users/`
var users = UserModel.list({age: 50});

BaseCollection

uses models created with BaseModel
extends Array object (uses Array object prototype)
implements infinitive load
implements pagination
allows extending collection object with custom methods

Define collection:

// Posts Collection
angular.module('MyApp')
    .factory('PostsCollection', function(BaseCollection, PostModel) {
        var PostsCollection = BaseCollection(PostModel);

        return PostsCollection;
    });

Use collection:

var posts = new PostsCollection();

// sends GET requests to /posts/ with parameters provided as first argument
posts.query({take: 10}, success, error);

// load more resources (infinitive load)
// sends GET requests to /posts/ with `take` and `skip` parameters
posts.loadMore(10, success, error);

// check if all resources are loaded
if (posts.allLoaded()) {
    //
}

// ... to be continued

Todo

add tests
allow collection objects to be nested
...

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

ng-nested-resource

Installation

Usage

BaseModel

BaseCollection

Todo