diff --git a/.vscode/settings.json b/.vscode/settings.json
index 2de7f91..4db9a75 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -4,7 +4,9 @@
"codelyzer",
"devkit",
"jasminewd",
+ "ngcc",
"packagr",
+ "rgba",
"tsickle"
]
}
\ No newline at end of file
diff --git a/README.MD b/README.MD
index 00f2f3d..14ade8f 100644
--- a/README.MD
+++ b/README.MD
@@ -1,31 +1,30 @@
+A library with more than 50 different loading spinners for Angular 4/5/6/7/8/9. (https://napster2210.github.io/ngx-spinner/)
+
NgxSpinner
-A library with more than 50 different loading spinners for Angular 4/5/6/7/8. (https://napster2210.github.io/ngx-spinner/)
-
-[![ng5](https://img.shields.io/travis/rust-lang/rust.svg?style=flat-square)]()
[![Support](https://img.shields.io/badge/Support-Angular%204%2B-blue.svg?style=flat-square)]()
[![Support](https://img.shields.io/badge/Support-Angular%205%2B-blue.svg?style=flat-square)]()
[![Support](https://img.shields.io/badge/Support-Angular%206%2B-blue.svg?style=flat-square)]()
[![Support](https://img.shields.io/badge/Support-Angular%208%2B-blue.svg?style=flat-square)]()
[![License](https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square)]()
[![devDependency Status](https://img.shields.io/david/expressjs/express.svg?style=flat-square)]()
+[![Gitter](https://badges.gitter.im/ngx-spinner/community.svg)](https://gitter.im/ngx-spinner/community?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
## What's New
+- Angular 9 support 🥳🥳🥳🥳
- Latest Angular Dependencies
-- Dynamic `z-index`
-- Smooth animation while `hide/show` the spinner
-- Debounce time to delay the spinner from hide
-- BUG fixes
+- `ng add` command to add `ngx-spinner` to the project
+- Image Support(Finally) 🥳🥳🥳🥳
Use appropriate version based on your Angular version.
-| Angular 4 | Angular 5 | Angular 6/7 | Angular 8 |
-| ----------- | ----------- | ----------- | --------- |
-| >= `v1.2.0` | >= `v2.0.0` | `v7.2.0` | `v8.1.0` |
+| Angular 4 | Angular 5 | Angular 6/7 | Angular 8 | Angular 9 |
+| ----------- | ----------- | ----------- | --------- | --------- |
+| >= `v1.2.0` | >= `v2.0.0` | `v7.2.0` | `v8.1.0` | `v9.0.0` |
## Table of contents
@@ -34,17 +33,20 @@ Use appropriate version based on your Angular version.
- [Browser Support](#browser-support)
- [Features](#features)
- [Demo](#demo)
- - [StackBlitz Demo:](#stackblitz-demo)
+ - [StackBlitz Demo](#stackblitz-demo)
- [Installation](#installation)
- [Usage](#usage)
-- [NgxSpinner Service](#ngxspinner-service)
-- [NgxSpinner Component](#ngxspinner-component)
- - [NOTE:](#note)
+- [Methods](#methods)
+- [Available Options](#available-options)
+ - [Using Spinner Type](#using-spinner-type)
+ - [Using Custom Spinner](#using-custom-spinner)
+ - [NOTE](#note)
- [How to use type?](#how-to-use-type)
- [Versioning](#versioning)
- [Creator](#creator)
- [Yuvraj Chauhan](#yuvraj-chauhan)
- [Future Plan](#future-plan)
+- [Ask Me](#ask-me)
- [Credits](#credits)
- [License](#license)
@@ -56,7 +58,8 @@ Use appropriate version based on your Angular version.
## Features
-- **Angular 8** Support
+- **Angular 9** Support
+- Custom spinner image support(gif), you can pass `img` tag
- Multiple Spinners
- Configurable option through service
- Fullscreen Mode(Enable/Disable)
@@ -68,7 +71,7 @@ Use appropriate version based on your Angular version.
[Working Demo](https://napster2210.github.io/ngx-spinner/)(Not Updated one)
-### StackBlitz Demo:
+### StackBlitz Demo
- [Normal Usage](https://stackblitz.com/edit/angular-kruvnm)
@@ -94,11 +97,18 @@ Using yarn:
$ yarn add ngx-spinner
```
+Using angular-cli:
+
+```bash
+$ ng add ngx-spinner
+```
+
## Usage
Import `NgxSpinnerModule` in in the root module(`AppModule`):
```typescript
+import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
// Import library module
import { NgxSpinnerModule } from "ngx-spinner";
@@ -106,7 +116,8 @@ import { NgxSpinnerModule } from "ngx-spinner";
imports: [
// ...
NgxSpinnerModule
- ]
+ ],
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
export class AppModule {}
```
@@ -139,23 +150,12 @@ Now use in your template
See [Demo](#demo)
-## NgxSpinner Service
+## Methods
- `NgxSpinnerService.show()` Shows the spinner
- `NgxSpinnerService.hide()` Hides the spinner
-## NgxSpinner Component
-
-```html
-
-
Loading...
-
-```
+## Available Options
- **[bdColor]**: RGBA color format.
To set background-color for backdrop, default `rgba(51,51,51,0.8)` where `aplha` value(0.8) is opacity of backdrop
@@ -171,10 +171,32 @@ See [Demo](#demo)
To set name for spinner, default `primary`
- **[zIndex]**: For dynamic z-index
To set z-index for the spinner, default `99999`
+- **[template]**: For custom spinner image
+ To set custom template for the custom spinner, default `null`
+
+#### Using Spinner Type
+```html
+
+