Features

• Plugable Loader
• No blacking out whole screen
• You can select your own color
• Set your loader wherever you want
• Select loader from lot of varieties
• Easy to use

Installation

• npm i vbloader

Examples

• This section will fill soon

How to add vb-loader

• Install vb-loader using npm i vbloader
• Include vb-loader module in your main app.module.ts (Or add it in your shared module) After adding your code should look like below

  import { BrowserModule } from '@angular/platform-browser';
    import { NgModule } from '@angular/core';
    import { AppRoutingModule } from './app-routing.module';
    import { AppComponent } from './app.component';
    import { VbLoaderModule } from 'vb-loader';
    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule,
        AppRoutingModule,
        VbLoaderModule
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

• Now go to your component.ts file where you are actually gonna add this loader
  • Import our serice by using below line

        import { VbLoaderService } from 'vb-loader';

  Now it's time to add your loader in html file

  <vb-loader *ngIf="vbLoaderService?.isEnabled?.value"></vb-loader>

• Now hide show loader on API call in component.ts file

  getUserDetails() {
    this.vbLoaderService.show();
    this.someUserApi.getSomeUserDetails.subscribe((someResponse: someTypeOfInterface) => {
      if (someResponse.status) {
      }
      this.vbLoaderService.hide();
    },
    (someError) => {
      this.vbLoaderService.hide();
    });
  }

Changelog

• 0.0.1
  • Basic Loader with Service to handle loader
• 0.0.2 (In Progress)
  • Choose from variety of loader

Reach me out at

[email protected]