Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kaosdev/rest-angular
An Angular Http Client for fast Rest APIs
https://github.com/kaosdev/rest-angular
angular http-client rest-api restful
Last synced: 12 days ago
JSON representation
An Angular Http Client for fast Rest APIs
- Host: GitHub
- URL: https://github.com/kaosdev/rest-angular
- Owner: kaosdev
- License: mit
- Created: 2019-01-31T21:53:49.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T21:52:54.000Z (almost 2 years ago)
- Last Synced: 2024-10-14T14:38:21.861Z (2 months ago)
- Topics: angular, http-client, rest-api, restful
- Language: TypeScript
- Size: 1.42 MB
- Stars: 0
- Watchers: 2
- Forks: 1
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Rest Angular Decorators
> Build fast REST APIs using decorators
## Getting Started
### Installing
```
npm install rest-angular-decorators
```
### Basic Usage
Create a new service that extends RestAngularClient.
Declare methods, parameters and base url.
```typescript
@Injectable({
providedIn: 'root'
})
@BaseUrl('https://jsonplaceholder.typicode.com')
@DefaultHeaders({
Accept: 'text/html'
})
export class TestService extends RestAngularClient {
// Path parameters
@GET('todos/:id')
getTodo(
@Path('id') id: number
): Observable { return null; }
// Body
@POST('todos')
createTodo(
@Body: todo: any
): Observable { return null; }
// Query parameters
@GET('todos')
getTodos(
@Query('limit') limit: number,
@QueryMap otherFilters: object
): Observable { return null }
}
```
Then in component just use the service
```typescript
@Component({
template: `
{{ todoTitle$ | async }}
`
})
class TestComponent {
todoTitle$ = this.testService.getTodo(42).pipe(
map(todo => todo.title)
);
constructor(
private readonly testService: TestService
) {
}
}
```
## Features
- All rest methods: @GET, @POST, @PUT, @PATCH, @DELETE
- Body parameter: @Body
- Path parameters: @Path
- Query parameters: @Query, @QueryMap
- Base url: @BaseUrl or by Injection of REST_BASE_URL
- Headers: @DefaultHeaders
## Customization
What if you don't like to write url like these `GET('path/:id')`?
What if you like curly braces a lot?
Just add this provider in AppModule and you can use paths with style `GET('path/{id}')`
```typescript
{provide: PathParserFactory, useClass: CurlyPathParserFactory}
```
You can also provide your own factories for:
- PathParserFactory
- BodyParserFactory
- QueryParserFactory
## Roadmap
- @Headers method decorator
- @Header & @HeaderMap parameter decorator
## Contribute
Every contribution is really appreciated.
## License
Rest Angular Decorators is released under the MIT license. [Read license](LICENSE).