vbloader

--- # 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

Usage no npm install needed!

<script type="module">
  import vbloader from 'https://cdn.skypack.dev/vbloader';
</script>

README


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

vinayjadhav680@gmail.com