1.2.5 • Published 6 years ago

angular2-counto v1.2.5

Weekly downloads
4,510
License
MIT
Repository
github
Last release
6 years ago

angular2-counto

Angular 5 package for nice count animations

Installation

npm install angular2-counto --save

SystemJS

var map = {
  'angular2-counto':     'node_modules/angular2-counto/src'
};

var packages = {
  'angular2-counto':   { main: 'counto.module.js', defaultExtension: 'js' }
};

Angular-CLI

Just import module as below:

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

@NgModule({
  imports:      [ BrowserModule, CountoModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

Example with currency pipe:

<div counto [step]="30" [countTo]="10" [countFrom]="0" [duration]="4" (countoChange)="counto = $event" (countoEnd)="onCountoEnd()">{{counto | currency:'EUR':'symbol':'1.2-2'}}</div>

Usage

ParameterRequiredUnitDescription
stepyesmilisecondHow fast counter is updated
countToyesnumberAny start number
countFromyesnumberAny end number
durationyessecondsDuration of animation

Any of above parameters can be freely binded to an event. Every time parameter changes, animation will be executed. You can use any pipe you want to modify output to your needs.

Demo

http://izupet.github.io/angular2-counto

brael-solarenginestongdai-bggabp-zero-templates-gabp-zero-template-gmanualabp-zero-templatabp-zero-templat-gabp-zero-template-gcointervu@everything-registry/sub-chunk-1138hymson1.0hike-appbiz-portal-frontendlance-kpi-boxchay-templateabp-zero-carabp-zero-cardsabp-zero-jpacs04abp-zero-jpacs10abp-zero-jpacs11abp-zero-jpacs2abp-zero-laoxieabp-zero-manualabp-zero-manual-publishabp-zero-manual-templateabp-zero-sprinthubabp-zero-sprinthubtestingabp-zero-sprinthubtesting2abp-zero-templat-cardsabp-zero-template-aabp-zero-template-ababp-zero-template-abcabp-zero-template-asdabp-zero-template-babp-zero-template-bcabp-zero-template-bcdabp-zero-template-bnmabp-jpacs-214abp-jpacs357abp-jpacs362abp-jpacs363abp-jpacs364abp-jpacs394abp-jpacs395abp-jpacs477abp-jpacs478abp-jpacs520abp-antech-jpacsabp-zero-template-cabp-zero-template-cardingabp-zero-template-cardsabp-zero-template-ccmabp-zero-template-ccmcabp-zero-template-cdabp-zero-template-cdeabp-zero-template-chayabp-zero-template-chay1abp-zero-template-cmabp-zero-template-cmcabp-zero-template-cpabp-zero-template-dabp-zero-template-deabp-zero-template-defabp-zero-template-eabp-zero-template-efabp-zero-template-efgabp-zero-template-efraiabp-zero-template-fabp-zero-template-fgabp-zero-template-fghabp-zero-template-ghabp-zero-template-ghiabp-zero-template-habp-zero-template-hiabp-zero-template-hijabp-zero-template-hjkabp-zero-template-hubabp-zero-template-iabp-zero-template-jklabp-zero-template-kabp-zero-template-klabp-zero-template-klmabp-zero-template-komabp-zero-template-labp-zero-template-lmabp-zero-template-lmnabp-zero-template-mabp-zero-template-manual-publishabp-zero-template-mcabp-zero-template-mcsabp-zero-template-mlpabp-zero-template-mnabp-zero-template-mnoabp-zero-template-mokabp-zero-template-nabp-zero-template-noabp-zero-template-nopabp-zero-template-oabp-zero-template-okmabp-zero-template-oknabp-zero-template-op
1.2.5

6 years ago

1.2.4

6 years ago

1.2.3

7 years ago

1.2.2

7 years ago

1.2.1

7 years ago

1.2.0

7 years ago

1.1.0

8 years ago

1.0.3

8 years ago

1.0.2

8 years ago

1.0.1

8 years ago

1.0.0

8 years ago