Angular 2 Slim Loading Bar
Angular2 component shows slim loading bar at the top of the page of your application.
Follow me to be notified about new releases.
Installation
npm install ng2-slim-loading-bar --save
Demo
Simple examples using ng2-slim-loading-bar:
- with SystemJS in ng2-systemjs-demo
- with Webpack in ng2-webpack-demo
Online demo available here
Usage
If you use SystemJS to load your files, you might have to update your config:
System;
Finally, you can use ng2-slim-loading-bar in your Angular 2 project:
- Import
SlimLoadingBarService, SlimLoadingBarComponent
fromng2-slim-loading-bar
- Instantiate
SlimLoadingBarService
in the bootstrap of your application; - Add
SlimLoadingBarComponent
to the "directives" property of your application component; - Add
<ng2-slim-loading-bar></ng2-slim-loading-bar>
tag in template of your application component.
;;; @ { } { // We can listen when loading will be completed thisslimLoadingBarServicestart { console; }; } ;
License
Credits
Inspired by ngProgress.js