Package Exports

ng2-component-spinner

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (ng2-component-spinner) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

ng2-component-spinner

Installation

To install this library, run:

$ npm install ng2-component-spinner --save

View Demo

Usage

$ npm install ng2-component-spinner

Configure your System.config

System.config({
  defaultJSExtensions: true,
  map: {
    "angular2": "node_modules/angular2",
    "rxjs": "node_modules/rxjs",
    ...
    "ng2-component-spinner": "node_modules/ng2-component-spinner/dist"
  },
  packages: {        
    'app': {
      main : './main.ts',
      defaultJSExtensions : 'ts'
    },
    'ng2-component-spinner' : {
      defaultExtension : 'js',
      main : 'index.js'
    }
  }
});

and then from your Angular AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Import Module
import { SpinnerComponentModule } from 'ng2-component-spinner';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,    
    // Add module to imports
    SpinnerComponentModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Once this library is imported, you can use it in your Angular application: NOTE: For this component to work, your template must be wrapped in a relative positioned root element.

<div style="position:relative">
    <h1>
        {{title}}
    </h1>
    <spinner-component [spinnerShow]="<booleanVariable>"></spinner-component>
</div>

Use a custom CSS spinner like this

<spinner-component [spinnerShow]="show">
    <div class="spinner-2">
      <div class="double-bounce1"></div>
      <div class="double-bounce2"></div>
    </div>
</spinner-component>

Development

To generate all *.js, *.js.map and *.d.ts files:

$ npm run tsc

To lint all *.ts files:

$ npm run lint