ng-orm
v0.0.5
Published
Rest orm for angular ^2
Downloads
23
Maintainers
Readme
ng-orm
REST api ORM with Angular ^2
Based on the work of ng2-rest
Compatible with
Install
To install package run:
$ npm install ng-orm --save
Import module
import { Resource } from 'ng-orm/ng-orm';
@NgModule({
bootstrap: [AppComponent],
imports: [
Resource
])
export class AppModule { }
Specification
| Name | Parameters | Description
| :---: | --- | ---: |
| **query** | `(optional) UrlParams[] ` | fetch array of your models, optionally with parameters |
| **get** | `UrlParams[] ` | get model by parameters |
| **save** | `model, UrlParams[] ` | post object model |
| **update** | `model, UrlParams[]` | put object model |
| **remove** | `UrlParams[]` | remove object by params |parameters |
## Resource
Fit you existing API (not only REST) into new fluent objects...
**Resource** it is more advance version of **SimpleResource**
Examples:
**service.ts**
```ts
@Injectable()
export class DatabaseService {
// < enum or 'string', single_model, query_model>
constructor(private rest: Resource<ENDPOINTS,User,User[]>) {
// map endpoints and urls
Resource.map(ENDPOINTS.API.toString(),
'http://localhost:/api');
Resource.map(ENDPOINTS.OTHER_API.toString(),
'http://example.com/api');
// define your models
rest.add(ENDPOINTS.API, 'users');
rest.add(ENDPOINTS.API, 'users/:some_param');
rest.add(ENDPOINTS.API, 'users/:some_param/books/:bookid');
}
// create your fluent API
get model() {
return {
getAll: this.rest
.api(ENDPOINTS.API, 'users')
.query(),
getAllSorted: this.rest
.api(ENDPOINTS.API, '/users/inside')
.query([{ sorted: true }]),
getSuperUser: this.rest
.api(ENDPOINTS.API, 'users/super')
.get([{id:0}]),
saveCurrentUser : this.rest
.api(ENDPOINTS.API, 'users')
.save(this.user)
}
};
mock_controller = (request: MockRequest<any> ):MockResponse
=> {
let user = request.data;
user.id = request.params['id'];
return { data:user };
}
users = [ { name:"name1":id:1 }, { name:"name2":id:2 } ]
get mocked_models() {
return {
getAllMocks: this.rest
.api(ENDPOINTS.API,'users')
.mock(JSON.stringify(this.users))
.query(),
getFirstMock: this.rest
.api(ENDPOINTS.API, 'users')
.mock(require('user.json')), 1000)
.get([{ id:0 }]), // timeout 1000ms = 1s
getDataFromController: this.rest
.api(ENDPOINTS.API, 'users')
.mock(require('user.json')), 0, mock_controller)
.get([{id:100}])
}
};
user:User;
}
component.ts
...
import { Subscription } from 'rxjs';
import { Resource } from 'ng-orm';
import { DatabaseService } from './service';
@Component({
..
})
export class DemoComponent implements OnInit, OnDestroy {
constructor(public db: DatabaseService, private snackBar: MdSnackBar) {
Resource.mockingMode.setMocksOnly();
}
handlers: Subscription[] = [];
users = [];
public ngOnInit() {
this.handlers.push(this.db.models.users.subscribe(data => {
this.users = data;
}));
}
public ngOnDestroy() {
this.handlers.forEach(h => h.unsubscribe())
}
}
Simple data mocking
It is one of the best features here. You don't need a backend for your front-end coding.
Simplest way to mocking data:
// user.json
[{ id: 12, name: 'Dariusz' },
{ id: 15, name: 'Marcin' }]
// service.ts
...
getUsers = () => this.rest.api( ENDPOINT.API, modelName )
.mock( require('./user.json') ).
query()
// component.ts
...
service.getUsers().subscribe( users => {
console.log( 'users:', users );
// users: [{ id: 12, name: 'Dariusz' }, { id: 15, name: 'Marcin' }]
}
Mock Controller
Sample MockController function to just return mocked data based on params:
// mock-controller.ts
export function mockController(
request: MockRequest<User> ): MockResponse
{
// request.data -> { id: 10, name: 'Dariusz' }
// request.params -> { id: 23 }
// request.body -> undefined -> only with .save(), update()
// request.backend - MockAutoBackend<User>
// request.method
let user = request.data;
user.id = request.params.id;
return { data:user }; // return nothing or undefined to propagate error
}
// service.ts
import { mockController } from './mock-controller';
...
data = (id) => this.rest.api( ENDPOINT.API, modelName )
.mock( { id: 10, name: 'Dariusz' }, mockController).
get([{ id: id }] ))
// component.ts
...
service.data(23).subscribe( user => {
console.log( 'user:', user ); // user: { id: 23, name: 'Dariusz' }
}
MockAutoBackend
generators [$]
If you wanna generate, filter, order, sort sample data try third options in controller - MockAutoBackend. It is perfect thing for mocking pagination in your MockController.
By building sample json data object with $ prefix property now it is possible to generate very nice random data.
Array
If value of property is an array, the generator will pick one at random:
{
"$id" : [1,2,3],
"name": "Dariusz"
}
The output will be:
{
"id": 2, // or 1 or 3 - it's random thing,
"name": "Dariusz" // property without $ stays the same
}
Of course it is possible to create json with nested $ fields.
String
You also can generate values using Faker mustache string as value.
{
"$fullTitle" : "{{name.lastName}}, {{name.firstName}} {{name.suffix}}"
}
Outputs:
{
"fullTitle": "Marks, Dean Sr."
}
Pagination example
Sample MockController generating pagination data with MockAutoBackend:
// model.json
{
$id : [1,2,3],
name: 'Dariusz'
}
// mock-controller.ts
export function mockController( request: MockRequest<T> ):MockResponse
{
console.log(request.backend.models); /// generated models
let pageNumber = request.params.pageNumber;
let pageSize = request.params.pageSize;
let data = request.backend.getPagination( pageNumber, pageSize );
return { data: data, code: 200 }; // code is optional, 200 is default
}
// example.service.ts
import { mockController } from './mock-controller';
...
numberOfGeneratedPaginartionModels = 400;
getPaginartion = (params) => this.rest.api( ENDPOINT.API, modelName)
.mock( requre('./model.json'),
mockController,
this.numberOfGeneratedPaginartionModels).query()
...
// component.ts
...
currentDisplayedModels = []
pageSize = 10;
pageChanged = ( n ) => {
this.service.getPagination({ pageNumber:n, pageSize: this.pageSize })
.subscribe( partOfMockedPaginationModels => {
currentDisplayedModels = partOfMockedPaginationModels;
})
}
Headers
With ng-orm you can also easily access your response and request headers
// you can also use class Resource for that
console.log(SimpleResource.Headers.request);
console.log(SimpleResource.Headers.response);