npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

angular-date-time-input

v1.2.1

Published

This angular directive allows users to manually enter date-time values in a variety of formats but displays the date value in the specified format.

Downloads

2,417

Readme

Angular Date/Time input

================================

Native AngularJS directive that allows user input of a date/time value. Valid dates are displayed in specified format, but input may be in any supported format.

Join the chat at https://gitter.im/dalelotts/angular-date-time-input MIT License Build Status Coverage Status Dependency Status devDependency Status JavaScript Style Guide semantic-release Commitizen friendly PayPal donate button

#Dependencies

Requires:

  • AngularJS 1.4.x or higher
  • MomentJS 2.1.x or higher

#Testing We use karma and linting tools to ensure the quality of the code. The easiest way to run these checks is to use grunt:

npm install
npm test

The karma task will try to open Chrome as a browser in which to run the tests. Make sure this is available or change the configuration in test\test.config.js

#Usage

Bower

This project does not directly support bower. If you are using wiredep, you can dd the following to your bower.json file to allow wiredep to use this directive.

  "overrides": {
    "angular-date-time-input": {
      "main": [
        "src/dateTimeInput.js",
      ],
      "dependencies": {
        "angular": "^1.x",
        "moment": "^2.x"
      }
    }
  }

NPM

We use npm for dependency management. Add the following to your package

npm install angular-date-time-input --save

This will copy the angular-date-time-input files into your node_modules folder, along with its dependencies.

Load the script files in your application:

<script type="text/javascript" src="node_modules/moment/moment.js"></script>
<script type="text/javascript" src="node_modules/angular/angular.js"></script>
<script type="text/javascript" src="node_modules/angular-date-time-input/src/js/dateTimeInput.js"></script>

Add this module as a dependency to your application module:

var myAppModule = angular.module('MyApp', ['ui.dateTimeInput'])

Apply the directive to your form elements:

<input data-date-time-input="YYYY-MMM-DD" />

Options

The value of the date-time-input attribute is the format the date values will be displayed.

Nota bene: The value saved in the model is, by default, a JavaScript Date object, not a string. This can result in differences between what is seen in the model and what is displayed.

date-time-input

This option controls the way the date is displayed in the view, not the model.

<input data-date-time-input="YYYY-MMM-DD" />

See MomentJS documentation for valid formats.

date-formats

This option defines additional input formats that will be accepted.

<input ... data-date-formats="['YYYY-MMM-DD']" />

Nota bene: Parsing multiple formats is considerably slower than parsing a single format. If you can avoid it, it is much faster to parse a single format.

See [MomentJS documentation] (http://momentjs.com/docs/#/parsing/string-formats) for more information.

date-parse-strict

This option enables/disables strict parsing of the input formats.

<input ... data-date-parse-strict="false" />

model-type

<input ... data-model-type="Date | moment | milliseconds | [custom format]" />

Default: 'Date'

Specifies the data type to use when storing the selected date in the model.

Accepts any string value, but the following values have special meaning (these values are case sensitive) :

  • 'Date' stores a Date instance in the model. Will accept Date, moment, milliseconds, and ISO 8601 strings as initial input from the model
  • 'moment' stores a moment instance in the model. Accepts the same initial values as Date
  • 'milliseconds' store the epoch milliseconds (since 1-1-1970) in the model. Accepts the same initial values as Date

Any other value is considered a custom format string.

##Contributing

See [Contributing] (contributing.md) document

License

angular-date-time-input is released under the MIT license and is copyright 2016 Knight Rider Consulting, Inc.. Boiled down to smaller chunks, it can be described with the following conditions.

It requires you to:

  • Keep the license and copyright notice included in angular-date-time-input's CSS and JavaScript files when you use them in your works

It permits you to:

  • Freely download and use angular-date-time-input, in whole or in part, for personal, private, company internal, or commercial purposes
  • Use angular-date-time-input in packages or distributions that you create
  • Modify the source code
  • Grant a sublicense to modify and distribute angular-date-time-input to third parties not included in the license

It forbids you to:

  • Hold the authors and license owners liable for damages as angular-date-time-input is provided without warranty
  • Hold the creators or copyright holders of angular-date-time-input liable
  • Redistribute any piece of angular-date-time-input without proper attribution
  • Use any marks owned by Knight Rider Consulting, Inc. in any way that might state or imply that Knight Rider Consulting, Inc. endorses your distribution
  • Use any marks owned by Knight Rider Consulting, Inc. in any way that might state or imply that you created the Knight Rider Consulting, Inc. software in question

It does not require you to:

  • Include the source of angular-date-time-input itself, or of any modifications you may have made to it, in any redistribution you may assemble that includes it
  • Submit changes that you make to angular-date-time-input back to the angular-date-time-input project (though such feedback is encouraged)

The full angular-date-time-input license is located in the project repository for more information.

Donating

Support this project and other work by Dale Lotts via gittip.

Support via Gittip