Knowledge Base

• # Introduction
• # Usage
• # ListOptions

The ApiService is an abstract service which contains some methods to make HTTP requests. The ApiService contains the following methods:

• get – Getting one specific resource
• create – Creating a resource
• delete – Deleting a resource
• update – Updating a resource using the PUT method
• updatePatch – Updating a resource using the PATCH method
• index – Retrieving paginated resources
• list – Retrieving a key value array of a resource
• uploadFiles – Upload multiple files

It uses the default CRUD routes for the requests.

To use the ApiService you can simply extend from ApiService:

import { ApiService } from '@capturum/api';

interface MyModel {
    id: string;
    name: string;
}

@Injectable({
  providedIn: 'root'
})
export class MyService extends ApiService<MyModel> {
  protected endpoint = 'my-model';
}

In this example you can see that we have a regular Angular service and it extends the ApiService. The generic <MyModel> refers to the interface of the response resources. So this means that when you do a get request it will have the return type: MyModel The endpoint property tells the ApiService what backend route to use. So in this example the base url will be: environment.baseUrl + ‘my-model’ (http://emendis-test.nl/api/my-model) Now you can start using the service like so:

import { MyService } from './my-service.service.ts';

class myComponent {
  constructor(private myService: MyService) {
    myService.get('xxx-xxxxx-xxx-xxxx').subscribe();
  }
}

With every method you can provide ListOptions. These are properties with which you can for example send filters sorting etc. The interface for these ListOptions is as followed:

interface ListOptions {
  include?: string[];
  sort?: { field: string; direction: 'asc' | 'desc' }[];
  perPage?: number;
  page?: number;
  filters?: { field: string; value: any; operator?: string }[];
  search?: string[];
  has?: { relation: string; count?: number; operator?: '=' | '>' | '<' | '>=' | '<=' }[];
  parameters?: { field: string; value: any }[];
}

• include

  With include option you can pass an array of relations which you want to be included in the repsonse

  this.myService.get(1, {include: ['relation1', 'relation2']});

• sort

  With the sort option you can define what fields it should sort by:

  this.myService.list({
  sort: [
   {
    field: 'name',
    direction: 'asc' 
   }
  ]
  });

• perPage

  This option defines how many resources it should fetch per page. This options only works for the index method

  this.myService.index({perPage: 50});

• page

  This option defines what page to get. This options only works for the index method

  this.myService.index({page: 1});

• filters

  This options defines the filters you want to use for fetching the resources. So for example: get all people who are older than 88

  this.myService.list({
    filters: [
       {
        field: 'age',
        value: 88,
        operator: 'greater'
       }
    ]
  });

• search

  With this option you can pass a string which the backend should search for across all columns

  this.myService.index({search: 'emendis'})

• count

  With this option you can pass a string array of relations of which the backend should return a count. The backend will return the count of the relations like <(RELATION)>_count.

  this.myService.index({count: ['projects', 'clients']})

• has

  With this options you can specify the amount of a specific relation which the resource should have. So for example: get all projects which have at least 3 developers

   this.myService.list({
     has: [
        {
         relation: 'developers',
         count: 3,
         operator: '>='
        }
     ]
   });

• parameters

  With the parameters options you can pass your own query params

  this.myService.list({parameters: [{ field: 'myparam': value: 'emendis' }]});