Product
Introducing SSO
Streamline your login process and enhance security by enabling Single Sign-On (SSO) on the Socket platform, now available for all customers on the Enterprise plan, supporting 20+ identity providers.
angular-datetime-range
Advanced tools
Readme
This directive is designed to provide easy and intuitive input of moment.js datetime objects.
Typically this can be used to represent a start and an end datetime object.
Desgined to be as simple as possible to afford intuitive interactions, including scrolling.
Converted into an angular directive for your convenience :)
Click here for a live demo.
bower install angular-datetime-range
Or with npm:
npm install angular-datetime-range
angular.module('myApp', [
'g1b.datetime-range',
......
])
<datetime-range start="start" end="end"></datetime-range>
Property | Usage | Default | Required |
---|---|---|---|
start | Start moment.js datetime object or a datetime string | none | yes |
end | End moment.js datetime object or a datetime string | none | yes |
presets | Array of preset ranges, click here for more info | none | no |
min-date | moment.js datetime object min datetime | none | no |
max-date | moment.js datetime object max datetime | none | no |
on-change | Handler function that is fired on change of start and/or end datetime objects | none | no |
on-change-start | Handler function that is fired on change of start datetime object | none | no |
on-change-end | Handler function that is fired on change of end datetime object | none | no |
on-close | Handler function that is fired on close of the edit popover | none | no |
close-text | Close text shown in the button used to close edit popover | Close | no |
You can provide any number of preset ranges for quick selection in edit view.
Consider the following example with ranges of current week, month and year.
$scope.presets = [
{
'name': 'This Week',
'start': moment().startOf('week').startOf('day'),
'end': moment().endOf('week').endOf('day'),
}, {
'name': 'This Month',
'start': moment().startOf('month').startOf('day'),
'end': moment().endOf('month').endOf('day'),
}, {
'name': 'This Year',
'start': moment().startOf('year').startOf('day'),
'end': moment().endOf('year').endOf('day'),
}
];
If you are looking for other datetime input elements, check out angular-datetime-inputs
FAQs
UI widget for datetime range input, converted to an angular directive for your convenience.
The npm package angular-datetime-range receives a total of 16 weekly downloads. As such, angular-datetime-range popularity was classified as not popular.
We found that angular-datetime-range demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Streamline your login process and enhance security by enabling Single Sign-On (SSO) on the Socket platform, now available for all customers on the Enterprise plan, supporting 20+ identity providers.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.