https://github.com/oxycoder/ng2-loading-animate

Loading animation for angular 2
https://github.com/oxycoder/ng2-loading-animate

Last synced: about 1 month ago
JSON representation

Loading animation for angular 2

• Host: GitHub
• URL: https://github.com/oxycoder/ng2-loading-animate
• Owner: oxycoder
• License: mit
• Archived: true
• Created: 2016-08-30T13:34:04.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2017-06-03T03:07:44.000Z (over 7 years ago)
• Last Synced: 2024-08-02T08:10:11.048Z (4 months ago)
• Language: TypeScript
• Size: 2.49 MB
• Stars: 14
• Watchers: 1
• Forks: 2
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-angular-components - ng2-loading-animate - Loading animation for angular 2 (Uncategorized / Uncategorized)

README

        
# Angular2 Loading Animate

[![Build Status](https://travis-ci.org/oxycoder/ng2-loading-animate.svg?branch=master)](https://travis-ci.org/oxycoder/ng2-loading-animate)

[![npm version](https://badge.fury.io/js/ng2-loading-animate.svg)](http://badge.fury.io/js/ng2-loading-animate)

[![devDependency Status](https://david-dm.org/oxycoder/ng2-loading-animate/dev-status.svg)](https://david-dm.org/oxycoder/ng2-loading-animate#info=devDependencies)

[![GitHub issues](https://img.shields.io/github/issues/oxycoder/ng2-loading-animate.svg)](https://github.com/oxycoder/ng2-loading-animate/issues)

[![GitHub stars](https://img.shields.io/github/stars/oxycoder/ng2-loading-animate.svg)](https://github.com/oxycoder/ng2-loading-animate/stargazers)

[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/oxycoder/ng2-loading-animate/master/LICENSE)

## Demo

https://oxycoder.github.io/ng2-loading-animate/demo/

## Table of contents

- [About](#about)

- [Installation](#installation)

- [Development](#development)

- [License](#licence)

## About

Loading animation for angular 2

## Installation

Install through npm:

```

npm install --save ng2-loading-animate

```

Then use it in your app like so:

app.module.ts

```typescript

import { LoadingAnimateModule, LoadingAnimateService } from 'ng2-loading-animate';

@NgModule({

  imports: [

    ...

    LoadingAnimateModule.forRoot()

    ...

  ],

  providers: [

    ...

    LoadingAnimateService

    ...

  ]

})

```

Add directives to your app.component.html (usually at top):

```html5

```

In component, to start loading animate:

test.component.ts

```typescript

import { LoadingAnimateService } from 'ng2-loading-animate';

constructor(private _loadingSvc: LoadingAnimateService)

start() {

  this._loadingSvc.setValue(true);

}

stop() {

  this._loadingSvc.setValue(false);

}

```

## Development

### Prepare your environment

* Install [Node.js](http://nodejs.org/) and NPM (should come with)

* Install local dev dependencies: `npm install` while current directory is this repo

### Development server

Run `npm start` to start a development server on port 8000 with auto reload + tests. 

### Testing

Run `npm test` to run tests once or `npm run test:watch` to continually run tests.

## License

MIT