The AngularJS Http Client Wrapper Created to Ease things up. Buffer each and evry requests and track the response.
You can use this advantage and shoot multiple requests to the server and
- later on check the response
- Get all the request where Error occoured
- Check if any pending Offline request (request made while client was offline)
- Retry Errors
- Retry Offlines
#OR
You can just simply let the library do make the request and then let just track if any errors.
clearAll()
, or specific buffer when you feel its the right time.!!!!
To install this library, run:
$ npm install ngx-api-gun --save
You can import your library in any Angular application by running:
$ npm install ngx-api-gun
and then from your Angular AppModule
:
File :
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { ApiGunModule, ApiGunService, BufferType, RequestBullet, RequestType } from 'ngx-api-gun'
@NgModule({
declarations: [
AppComponent
],
imports: [
HttpClientModule,
BrowserModule,
FormsModule,
//our module
ApiGunModule
],
//our service Note: In later updated forRoot() added.
providers: [ApiGunService],
bootstrap: [AppComponent]
})
export class AppModule { }
and then from your Angular AppModule
:
File :
app.component.ts
import { Component } from '@angular/core';
// New import
import { ApiGunModule, ApiGunService, BufferType, RequestBullet, RequestType } from 'ngx-api-gun'
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
// Initilizing Bullets
Req: RequestBullet = new RequestBullet();
// Injection of Gun Service
constructor(public _gun: ApiGunService) {
}
addHeader() {
this._gun.appendHeader('key', 'value');
}
addAuthorization() {
this._gun.setBasicAuthorizationHeader('username','password');
}
addRequest() {
// Object.assign
let x = JSON.parse(JSON.stringify(this.Req));
//load a single request to buffer it
let id = this._gun.loadSingleBullet(x);
//initialize again
this.Req = new RequestBullet();
}
shootRequest() {
// shoot all pending request
this._gun.fire();
}
logSuccess() {
this._gun.logBufferToConsole(BufferType.SUCCESS);
}
logError() {
this._gun.logBufferToConsole(BufferType.ERROR);
}
logAll() {
this._gun.logBufferToConsole(BufferType.MAIN);
}
// simply retry errors any time.
retryError() {
this._gun.retryErrors();
}
retryOffline() {
this._gun.retryOfflines();
}
setBufferToLocal() {
this._gun.saveBulletsToLS();
}
setBufferFromLocal() {
this._gun.loadBulletsFromLS();
}
}
File :
app.component.html
<div>
<ul>
<li>
<input [(ngModel)]="Req.url" />
</li>
<li>
<input [(ngModel)]="Req.data" />
</li>
<li>
<button (click)="addRequest()">Add</button>
</li>
<li>
<button (click)="shootRequest()">Shoot</button>
</li>
<li>
<button (click)="logError()">Log Error</button>
</li>
<li>
<button (click)="logAll()">Log Pending</button>
</li>
<li>
<button (click)="logSuccess()">Log Success</button>
</li>
<li>
<button (click)="retryError()">Retry Error</button>
</li>
<li>
<button (click)="setBufferToLocal()">Save Locally</button>
</li>
<li>
<button (click)="setBufferFromLocal()">get from LS</button>
</li>
</ul>
</div>
Once your library is imported, you can use its components, directives and pipes in your Angular application:
Get a complete detail here
Please report bugs and issues here.
Get a complete detail here
To generate all *.js
, *.d.ts
and *.metadata.json
files:
$ npm run packagr
To lint all *.ts
files:
$ npm run lint
To docs
$ npm run docs:build
- ecrypting before saving to LS and Buffer change to BufferType
- Remove abstracted component.
- Working Library , with all abstraction
MIT © Sourabh Rustagi