ng6-date-countdown
TypeScript icon, indicating that this package has built-in type declarations

1.0.3 • Public • Published

Europe



Make customizables Date Countdowns with this simple and easy angular 5 component.



Europe


Europe


Europe


Fork https://github.com/matheushf/ng2-date-countdown


Instalation

npm install ng2-date-countdown --save

In your app.module, add CountDown to your declarations:

import {CountDown} from "ng2-date-countdown";

@NgModule({
   declarations: [
     AppComponent,
     CountDown
   ],
   imports: [
     BrowserModule
   ],
   bootstrap: [AppComponent]
 })

Usage

(reached)="someFunction($event)" You can use a Callback function for when it reaches 0"

[text]: Change the text displayed in the date

[units]: Choose wich units do you wanna display

[divider]: Choose what do you want to divade the dates

[showZeros]: Choose if you want to show a zero before the number '01 Days'

In your html template:

<countdown units="Year | Month | Days | Hours | Minutes | Seconds"  end="July 22, 2019"></countdown>

To set a custom Language and divider, set this variable in your component.ts file:

text:any = {
    Year: 'Year',
    Month: 'Month',
    Weeks: "Weeks",
    Days: "Days",
    Hours: "Hours",
    Minutes: "Minutes",
    Seconds: "Seconds",
    MilliSeconds: "MilliSeconds"
  };

In your .html:

<countdown (reached)="callback($event)" [text]="text" units="Year | Month | Days | Hours | Minutes | Seconds"  end="July 22, 2019"></countdown>

To customize the Countdown (.scss), use the class from it (you can inspect from chrome elements) and put the '/deep/' before them, example:

    /deep/ .countdown {
      width: 100%;
      height: 100px;
      background: black;

      .measurements {
        color: white;
        margin-right: 5px;
        padding: 10px;
     }

     .divider {
      font-size: 30px;
     }

@todo

  • Get AOT running

Inspired on the component: https://github.com/previousdeveloper/angular2-simple-countdown

Package Sidebar

Install

npm i ng6-date-countdown

Weekly Downloads

1

Version

1.0.3

License

MIT

Unpacked Size

14.4 kB

Total Files

6

Last publish

Collaborators

  • webeferen