This is an experimental implementation of an API Entity Management Service for Angular.
Run yarn add angular-aems
in your project root.
Import AngularAemsModule
in your app.
import { AngularAemsModule } from 'angular-aems';
@NgModule({
imports: [
AngularAemsModule
]
})
export class AppModule {
}
Inject EntityService
into your component and set the apiBaseUrl
.
import { Component, OnInit } from '@angular/core';
import { EntityService } from 'angular-aems';
import { Event } from './_interfaces/event.interface';
@Component({
selector: 'app-root',
template: `<h2>Events</h2>
<ul>
<li *ngFor="let event of events">{{ event.title }}</li>
</ul>`
})
export class AppComponent implements OnInit {
events: Event[];
constructor(
private eventService: EntityService<Event>
) {
eventService.config = {
apiBaseUrl: 'events'
};
}
ngOnInit() {
this.eventService.getAll().subscribe(events => this.events = events);
}
}
There are three kinds of services to help getting the job done.
Service
Transformer
Resource
The Service
is the only "public" service you want to use directly in your code. Methods exists for read, write, update and delete one or more items.
If you extend the EntityService, the following methods are available:
/**
* Set configuration for this instance
* @param config Object of type EntityConfig.
*/
setConfig(config: EntityConfig): void {
this.config = config;
}
/**
* Get one item.
* @param id Id of the item you want to get.
*/
getOne(id: number): Observable<T> {
return this.resource.getOne(id, this.config.apiBaseUrl).pipe(
map((entity: T) => this.transformer.backendToFrontend(entity))
);
}
/**
* Get all items
*/
getAll(): Observable<T[]> {
return this.resource.getAll(this.config.apiBaseUrl).pipe(
map((entities: T[]) => entities.map(x => this.transformer.backendToFrontend(x)))
);
}
The Transformer
is the service, which is internally used to transform the data from the frontend interface (used in our application) with the backend interface (provided by the rest endpoint).
The Resource
is the part of the concept, which talks to the backend.