README
A spinner loading for Angular 4.
Demo
Installation
$ npm install --save plus-spinner
Usage
Import the PlusSpinnerModule
in your module:
import { NgModule } from '@angular/core';
//...
import { PlusSpinnerModule } from "plus-spinner";
@NgModule({
imports: [
//...
PlusSpinnerModule.forRoot()
],
})
export class AppModule { }
How to use...
import { Component, OnInit } from '@angular/core';
@Component({
//...
})
export class PlusComponent implements OnInit {
//...
public isRunning: boolean = false;
constructor(private plusService: PlusService) { }
ngOnInit() { }
public loadFakeData() {
//Start showing plus-spinner
this.isRunning = true;
this.plusService.getFakeData()
.subscribe(res => {
//Hide plus-spinner
this.isRunning = false;
//...
}, err => {
//Hide plus-spinner
this.isRunning = false;
//...
});
}
}
Input parameters
Input | Required | Details |
---|---|---|
isRunning | Required | Boolean, determines when will show plus-spinner. |
spinner | Optional | String, Default: bounce , Types of plus-spinner |
spinnerInBox | Optional | Boolean, Default: true plus-spinner set parent position to relative |
spinnerContainerClass | Optional | String, Css class for plus-spinner container |
spinnerClass | Optional | String, Css class for plus-spinner box |
delay | Optional | Number, Default: 0 , Delay before show plus-spinner |
Types spinner
let allowSpinner = [
'bounce',
'plane',
'stretch',
'cube',
'scaleout',
'dot',
'bouncedelay',
'plus-circle',
'cube-grid',
'fading-circle',
'folding-cube'
];
License
ISC © Alexander Kryhtenko