{"id":13497490,"url":"https://github.com/cipchk/ngx-countdown","last_synced_at":"2025-04-12T17:41:58.003Z","repository":{"id":38548756,"uuid":"89559477","full_name":"cipchk/ngx-countdown","owner":"cipchk","description":"Simple, easy and performance countdown for angular","archived":false,"fork":false,"pushed_at":"2024-04-08T18:27:23.000Z","size":3634,"stargazers_count":191,"open_issues_count":8,"forks_count":58,"subscribers_count":7,"default_branch":"master","last_synced_at":"2024-04-14T06:43:52.226Z","etag":null,"topics":["angular","angular-countdown","angular5","countdown","ngx-countdown","performance-countdown"],"latest_commit_sha":null,"homepage":"https://cipchk.github.io/ngx-countdown/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cipchk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-04-27T05:34:39.000Z","updated_at":"2024-06-15T14:27:22.580Z","dependencies_parsed_at":"2023-02-01T02:16:06.470Z","dependency_job_id":"d13bce72-108b-40e3-a426-166210634057","html_url":"https://github.com/cipchk/ngx-countdown","commit_stats":{"total_commits":68,"total_committers":4,"mean_commits":17.0,"dds":"0.13235294117647056","last_synced_commit":"e7e49b25f21d424e959a6b3ca74a10e218479209"},"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cipchk%2Fngx-countdown","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cipchk%2Fngx-countdown/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cipchk%2Fngx-countdown/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cipchk%2Fngx-countdown/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cipchk","download_url":"https://codeload.github.com/cipchk/ngx-countdown/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248608124,"owners_count":21132664,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","angular-countdown","angular5","countdown","ngx-countdown","performance-countdown"],"created_at":"2024-07-31T20:00:31.953Z","updated_at":"2025-04-12T17:41:57.980Z","avatar_url":"https://github.com/cipchk.png","language":"TypeScript","funding_links":[],"categories":["Uncategorized","Third Party Components"],"sub_categories":["Uncategorized","Visual Effects"],"readme":"# ngx-countdown\n\nSimple, easy and performance countdown for angular\n\n[![NPM version](https://img.shields.io/npm/v/ngx-countdown.svg)](https://www.npmjs.com/package/ngx-countdown)\n[![Ci](https://github.com/cipchk/ngx-countdown/workflows/Ci/badge.svg)](https://github.com/cipchk/ngx-countdown/actions?query=workflow%3ACi)\n[![codecov](https://codecov.io/github/cipchk/ngx-countdown/graph/badge.svg?token=SPQeYvppgH)](https://codecov.io/github/cipchk/ngx-countdown)\n\n## Demo\n\n- [Live Demo](https://cipchk.github.io/ngx-countdown/)\n- [Stackblitz](https://stackblitz.com/edit/ngx-countdown-setup)\n\n## Usage\n\n### 1. Install\n\n```\nnpm install ngx-countdown --save\n```\n\nimport `CountdownModule`。\n\n```typescript\nimport { CountdownModule } from 'ngx-countdown';\n\n@NgModule({\n  imports: [ BrowserModule, CountdownModule ],\n  declarations: [AppComponent],\n  bootstrap: [AppComponent]\n})\nexport class AppModule { }\n```\n\n### 2、Template\n\n```html\n\u003ccountdown #cd [config]=\"config\" (event)=\"handleEvent($event)\" /\u003e\n```\n\n**Method**\n\n| Name | Description |\n|------|-------------|\n| `begin()` | Start countdown, you must manually call when `demand: false` |\n| `restart()` | Restart countdown |\n| `stop()` | Stop countdown, must call `restart` when stopped, it's different from pause, unable to recover |\n| `pause()` | Pause countdown, you can use `resume` to recover again |\n| `resume()` | Resume countdown |\n\n**How call component methods**\n\n```ts\n@ViewChild('cd', { static: false }) private countdown: CountdownComponent;\nthis.countdown.begin();\n```\n\n### Standalone\n\n```ts\n@Component({\n  template: `\u003ccountdown /\u003e`,\n  imports: [CountdownComponent],\n})\nexport class App\n```\n\n## API\n\n### countdown\n\n| Name | Type | Default | Summary |\n|------|------|---------|---------|\n| `config` | `CountdownConfig` | - | Config |\n| `event` | `EventEmitter\u003cCountdownEvent\u003e` | - | Events |\n\n### CountdownConfig\n\n| Name | Type | Default | Summary |\n|------|------|---------|---------|\n| demand | `boolean` | `false` | Start the counter on demand, must call `begin()` to starting |\n| leftTime | `number` | `0` | Calculate the remaining time based on the server, e.g: `10`,`5.5`, (Unit: seconds) |\n| stopTime | `number` | - | Refers to counting down from local time to end time (Unit: Milliseconds second UNIX timestamp) |\n| format | `string` | `HH:mm:ss` | Formats a date value, pls refer to [Accepted patterns](https://angular.io/api/common/DatePipe#usage-notes) |\n| prettyText | `(text: string) =\u003e string` | - | Beautify text, generally used to convert formatted time text into HTML |\n| notify | `number[], number` | - | Should be trigger type `notify` event on the x second. When values is `0` will be trigger every time |\n| formatDate | `CountdownFormatFn` | - | Default based on the implementation of `formatDate` in `@angular/common`, You can changed to other libs, e.g: [date-fns](https://date-fns.org/v2.0.1/docs/format) |\n| timezone | `string` | `+0000` | A timezone offset (such as '+0430'), or a standard UTC/GMT. When not supplied, uses the end-user's local system timezone |\n\n### CountdownEvent\n\n| Name | Type | Summary |\n|------|------|---------|\n| `action` | `start,stop,restart,pause,resume,notify,done` | Action of the event |\n| `status` | `CountdownStatus` | Status of the countdown |\n| `left` | `number` | Number of remaining milliseconds |\n| `text` | `string` | Format the text |\n\n**Global Config**\n\n```ts\nbootstrapApplication(AppComponent, {\n  providers: [provideCountdown({ format: `mm:ss` })],\n}).catch((err) =\u003e console.error(err));\n```\n\n## Troubleshooting\n\nPlease follow this guidelines when reporting bugs and feature requests:\n\n1. Use [GitHub Issues](https://github.com/cipchk/ngx-countdown/issues) board to report bugs and feature requests (not our email address)\n2. Please **always** write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.\n\nThanks for understanding!\n\n### License\n\nThe MIT License (see the [LICENSE](https://github.com/cipchk/ngx-countdown/blob/master/LICENSE) file for the full text)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcipchk%2Fngx-countdown","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcipchk%2Fngx-countdown","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcipchk%2Fngx-countdown/lists"}