Created
November 9, 2015 21:52
-
-
Save csaftoiu/b4af4b04291907377990 to your computer and use it in GitHub Desktop.
Auto-generated doc for foundation-datepicker-angular
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<h1><code ng:non-bindable="">datePicker</code> | |
<div><span class="hint">directive in module <code ng:non-bindable="">foundation.datepicker.angular</code> | |
</span> | |
</div> | |
</h1> | |
<div><h2 id="description">Description</h2> | |
<div class="description"><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>Element directive for | |
<a href="http://foundation-datepicker.peterbeno.com/example.html">foundation-datepicker</a>. | |
Adds a text input field which, when clicked, pops up the datepicker.</p> | |
</div></div> | |
<h2 id="usage">Usage</h2> | |
<div class="usage">as element:<pre class="prettyprint linenums"><date-picker | |
ng-model="{string}" | |
[format="{string}"] | |
[language="{string}"] | |
[pick-time="{string}"] | |
[ng-mindate="{expression}"] | |
[ng-maxdate="{expression}"]> | |
</date-picker></pre> | |
<h4 id="usage_parameters">Parameters</h4><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>ngModel</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>Assignable angular expression to data-bind the date to. | |
This should be a JavaScript Date object.</p> | |
</div></td></tr><tr><td>format <div><em>(optional)</em></div></td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>The date format, combination of d, dd, m, mm, yy, yyyy, hh, ii. Default <code>"yyyy-mm-dd"</code>.</p> | |
</div></td></tr><tr><td>language <div><em>(optional)</em></div></td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>Two-char iso shortcut of language you want to use, default <code>"en"</code>. Must include the | |
proper locale <code>.js</code> file, via a <code><script></code> tag.</p> | |
</div></td></tr><tr><td>pickTime <div><em>(optional)</em></div></td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>Provide this param to enable picking the time after picking the date.</p> | |
</div></td></tr><tr><td>ngMindate <div><em>(optional)</em></div></td><td><a href="" class="label type-hint type-hint-expression">expression</a></td><td><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>Specify a minimum allowable date.</p> | |
</div></td></tr><tr><td>ngMaxdate <div><em>(optional)</em></div></td><td><a href="" class="label type-hint type-hint-expression">expression</a></td><td><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>Specify a maximum allowable date.</p> | |
</div></td></tr></tbody></table></div> | |
<h2 id="example">Example</h2> | |
<div class="example"><div class="foundation-datepicker-angular-directive-page foundation-datepicker-angular-directive-datepicker-page"><p>Generate an input element which picks a date and time, bound to <code>$scope.travelTime</code>, that must be >= today's date.</p> | |
<p>HTML: | |
<pre class="prettyprint linenums"> | |
<date-picker ng-model="travelTime" pick-time | |
format="yyyy-mm-dd hh:ii" | |
ng-mindate="today"></date-picker> | |
</pre> | |
Controller: | |
<pre class="prettyprint linenums"> | |
$scope.travelTime = new Date(); | |
var now = new Date(); | |
$scope.today = new Date(now.getFullYear(), now.getMonth(), now.getDate()); | |
</pre> | |
Output may be something like: <br> | |
<img src="http://i.imgur.com/5KWGtqu.png"></p> | |
</div></div> | |
</div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment