Api - luftsport/nlf-client GitHub Wiki

REST api definition

rest.service.ts

This is the base class of the api and handles all actual xhr connections (GET, POST, PUT, PATCH)

The base class sets the baseUrl (absolute url) for the api.

Convenient wrappers

getList() //gets the collection
getItem() //get one item from collection by custom resource id or mongodb _id
getItemById() //get one item from collection by custom resource id
post()
put()
patch()

All items take the following parameters: relativeUrl: string, id: number|string, options: OptionsInterface = {}

All lists (collections) take the following parameters: relativeUrl: string, options: OptionsInterface = {}

Where relativeUrl is the relative path to the resource from and excluding the baseurl.

All methods return a Observable<any>

The parameter options is structured of OptionsInterface:

export interface OptionsInterface {
  query?: QueryInterface;
  body?: any;
  params?: HttpParams | { [param: string]: string | string[];};
  headers?: HttpHeaders | { [header: string]: string | string[]; }
  reportProgress?: boolean;
  responseType?: 'json';
  withCredentials?: boolean;
  observe?: 'body';
}

which basically follows HTTPClient with the following extras:

  • query complies to Eve's query syntax and will be converted to HttpParams
  • params should not be used (will be overwritten)

See Eve query syntax for more information.

Now you can use the options parameter to build custom wrappers for respective resources in <resource>.service.ts or just let it be exposed directly to components to configure the options array.

Note that:

  • access tokens are handled by the http interceptor in root
  • default headers are imposed for Content-Type and Accept
  • only resource wrappers should access the base class (not directly from components or other)

.service.ts

Extends rest.service as a thin layer with custom options for respective resource.

Each resource needs the relativeUrl (relative url including post and trailing /) constant property set.

At the simplest just a wrapper:

 public getUsers(options?: OptionsInterface): Observable<UserList> {

    return this.getList(this.relativeUrl, options);
}

This leaves it to the user to configure the options parameter, as an example a query to the list/collection options.query = {where: {club: '375-F'}} which will only return clubs with id 375-F. Since the options.query is a normal javascript object you can convenient pass it parameters and also get linter feedback when the syntax is off.

More specific wrappers could leave the options parameter out like:

 public getUserFirstName(id: string): Observable<UserList> {

    let options = {query: {projection: {firstname: 1}}};
    return this.getItem(this.relativeUrl, id, options);
}

This will only return the field firstname for the given user id (and the api generated metadata). Components will not have access to the options parameter and should not.

Usage in components

Use the resource service(s) you need. To fill in the request object options: OptionsInterface use something like:

let options: OptionsInterface = {
        query: { page: this.pagination.offset,
                 max_results: this.pagination.limit,
                 sort: this.sort
                },
        headers: {'X-Some-Header': 'Have a fishy day!'},
    }

The options.query property follow the query interface QueryInterface which follows Eve's query syntax (similar to raw MongoDB syntax). Here we also added a custom header.

export interface QueryInterface {
  where?: any; //string mongodb query
  max_results?: number; //number
  page?: number; //number
  sort?: any; //string or array? [{key: 1}] or ["-key", "key2", ...]
  aggregate?: any; //string
  projection?: any; 
}

Then call the resource.service and subscribe to the observable:

this.<resource>Service.getListFromResource(options).subscribe(
      data => {
        this.data = data._items; //Eve holds data in the _items property of the response
      },
      err => console.error(err),
      () => console.log("Done for now")
      );
    }
⚠️ **GitHub.com Fallback** ⚠️