{"id":21068894,"url":"https://github.com/aaron-sterling/ng-datefns-pipes","last_synced_at":"2025-05-16T03:33:40.505Z","repository":{"id":143894672,"uuid":"118389509","full_name":"Aaron-Sterling/ng-datefns-pipes","owner":"Aaron-Sterling","description":"Angular pipes based on date-fns. Date pipe, time-ago pipe, minDate pipe, maxDate pipe, distanceBetweenDates pipe.","archived":false,"fork":false,"pushed_at":"2018-01-30T19:07:47.000Z","size":57,"stargazers_count":5,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-03T04:02:32.223Z","etag":null,"topics":["angular","date","date-distance","date-fns","date-pipe","ionic","max-date","min-date","pipe","time-ago"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Aaron-Sterling.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"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":"2018-01-22T01:14:17.000Z","updated_at":"2020-01-28T14:04:25.000Z","dependencies_parsed_at":"2024-02-29T20:45:13.575Z","dependency_job_id":null,"html_url":"https://github.com/Aaron-Sterling/ng-datefns-pipes","commit_stats":{"total_commits":38,"total_committers":1,"mean_commits":38.0,"dds":0.0,"last_synced_commit":"2cddceb69546cb7a070466eb5940ac7f817f0189"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aaron-Sterling%2Fng-datefns-pipes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aaron-Sterling%2Fng-datefns-pipes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aaron-Sterling%2Fng-datefns-pipes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Aaron-Sterling%2Fng-datefns-pipes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Aaron-Sterling","download_url":"https://codeload.github.com/Aaron-Sterling/ng-datefns-pipes/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225405080,"owners_count":17469279,"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","date","date-distance","date-fns","date-pipe","ionic","max-date","min-date","pipe","time-ago"],"created_at":"2024-11-19T18:28:34.739Z","updated_at":"2024-11-19T18:28:35.467Z","avatar_url":"https://github.com/Aaron-Sterling.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ng-datefns-pipes\nAngular pipes based on date-fns. Date pipe, time-ago pipe, minDate pipe, maxDate pipe, distanceBetweenDates pipe. I initially built these for Ionic projects, because the Angular date pipe was not performing well on all mobile devices, and the date-fns functions were not exhibiting problems. However, no use of Ionic is required. This npm library should work with any Angular 5 project, and any Ionic 3 project.\n\n1. [Installation](https://github.com/Aaron-Sterling/ng-datefns-pipes/blob/master/README.md#installation)\n2. [Sample usage](https://github.com/Aaron-Sterling/ng-datefns-pipes/blob/master/README.md#sample-usage)\n3. [Basic setup](https://github.com/Aaron-Sterling/ng-datefns-pipes/blob/master/README.md#basic-setup)\n4. [Advanced setup](https://github.com/Aaron-Sterling/ng-datefns-pipes/blob/master/README.md#advanced-setup)\n5. [API](https://github.com/Aaron-Sterling/ng-datefns-pipes/blob/master/README.md#api)\n\nNext page: [Non-English locales](https://github.com/Aaron-Sterling/ng-datefns-pipes/blob/master/src/non-English-locales/README.md)\n\n## Installation\n\nEnglish locale:\n\n```npm install ng-datefns-pipes --save```\n\nSupport for all date-fns locales:\n\n```npm install ng-datefns-pipes-all-locales --save```\n\n## Sample usage\nDate pipe:\n```\nnapoleon = new Date(1804, 11, 2);                           // in ts file\nNapoleon crowned himself emperor on {{ napoleon | date }}.  // in template\nNapoleon crowned himself emperor on December 2nd, 1804.     // output\n```\nTime ago pipe:\n```\naquinas = new Date(1274, 2, 7);          // in ts file\nAquinas died {{ aquinas | ago }}.\u003cbr\u003e    // in template\nAquinas died almost 744 years ago.       // output\n```\nTime ago pipe second example:\n```\nnow = new Date();                              // in ts file\nYou entered this page {{ now | ago }}.         // in template\nYou entered this page less than 5 seconds ago. // output (updates every 15 seconds)\n```\nDistance between dates:\n```\ndatePair = [ this.aquinas, this.napoleon ];                                                // in ts file\nAquinas's and Napoleon's actions were separated by {{ datePair | distanceBetweenDates }}.  // in template\nAquinas's and Napoleon's actions were separated by almost 531 years.                       // output\n```\nMin date:\n```\ndateArray = [ this.aquinas, this.napoleon, this.now ];    // in ts file\nThe earliest of those dates is {{ dateArray | minDate }}. // in template\nThe earliest of those dates is March 7th, 1274.           // output \n```\nMax date:\n```\nThe most recent of those dates is {{ dateArray | maxDate }}. // in template (ts file same as before)\nThe most recent of those dates is ___.    // \u003c-- output, blank contains today's date\n```\n\n## Basic setup\nIn ```app.module.ts```:\n```\nimport { DatePipesModule } from 'ng-datefns-pipes';\n\n@NgModule({\n  declarations: [],\n  imports: [\n    DatePipesModule.forRoot() // \u003c -- add this line\n  ],\n  bootstrap: [],\n  entryComponents: [],\n  providers: []\n})\nexport class AppModule {}\n```\nThis gives you access to all the (English language) date pipes, with the default configuration. For details, see the API below.\n## Advanced Setup\nYou can specify a default date format; whether date distance functions include seconds; and the prefix, suffix, refresh rate and use of seconds of the timeAgo pipe. (For more detail about these settings, see the API below. You can also set and reset each setting during the program by injecting the DatePipeManager.)\n\nIn ```app.module.ts```:\n```\nimport { DatePipesModule, DatePipeConfiguration } from 'ng-datefns-pipes';\n\nconst DATE_PIPE_CONFIG: DatePipeConfiguration = {\n   defaultDateFormat: 'your date format string',    // default: 'MMMM Do, YYYY'\n   dateDistanceIncludesSeconds: your boolean here,  // default: false\n   agoPipeOptions: {\n     refreshRate: your milliseconds here,           // default: 15000\n     prefix: 'your prefix string',                  // default: ''\n     suffix: 'your suffix string',                  // default: ' ago' \u003c-- note the space\n     includeSeconds: your boolean here              // default: false\n   }\n}\n\n@NgModule({\n  declarations: [],\n  imports: [\n    DatePipesModule.forRoot(DATE_PIPE_CONFIG) // \u003c -- add this line\n  ],\n  bootstrap: [],\n  entryComponents: [],\n  providers: []\n})\nexport class AppModule {}\n```\n\n## API\n\n1. [Date pipe](docs/api/date-pipe.md)\n2. [Time ago pipe](docs/api/time-ago-pipe.md)\n3. [Distance between dates pipe](docs/api/distance-between-dates-pipe.md)\n4. [MaxDate pipe](docs/api/max-date-pipe.md)\n5. [MinDate pipe](docs/api/min-date-pipe.md)\n\nNext page: [Non-English locales](https://github.com/Aaron-Sterling/ng-datefns-pipes/blob/master/src/non-English-locales/README.md)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faaron-sterling%2Fng-datefns-pipes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faaron-sterling%2Fng-datefns-pipes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faaron-sterling%2Fng-datefns-pipes/lists"}