<div class="header-panel member">
<h2><span class="identifier">WjInputTime</span> Class</h2>
<dl class="dl-horizontal">
<dt>File</dt><dd class="filename">wijmo.angular.js</dd>
<dt>Module</dt><dd><a href="topic/wijmo.angular.Module.html"><span class="identifier">wijmo.angular</span></a></dd>
<dt>Base Class</dt><dd><a href="topic/wijmo.angular.WjComboBox.Class.html"><span class="identifier">WjComboBox</span></a></dd>
<dt>Show</dt>
<dd>
<label><input type="checkbox" ng-model="ctx.showInherited"> Inherited Members</label>&nbsp;&nbsp;&nbsp;
<label><input type="checkbox" ng-model="ctx.showRaisers"> Event Raisers</label>
</dd>
</dl>
<div class="comment"><p>AngularJS directive for the <a href="topic/wijmo.input.InputTime.Class.html"><span class="identifier">InputTime</span></a> control.</p>
<p>Use the <b>wj-input-time</b> directive to add <b>InputTime</b> controls to your AngularJS applications. 
Note that directive and parameter names must be formatted as lower-case with dashes 
instead of camel-case. For example:</p>


<pre>&lt;p&gt;Here is an InputTime control:&lt;/p&gt;
&lt;wj-input-time 
  value="theDate" 
  format="h:mm tt"
  min="09:00" max="17:00"
  step="15"&gt;
&lt;/wj-input-time&gt;</pre>
<p><div class="member-panel example"><h3 class="node collapsed">Example</h3><div class="fiddle"><script async src="https://jsfiddle.net/Wijmo5/46PhD/embed/result,html,js,css"></script></div></div></p>
<p>This example edits a <b>Date</b> value (that includes date and time information)
using an <a href="topic/wijmo.input.InputDate.Class.html"><span class="identifier">InputDate</span></a> and an InputTime control. Notice how both controls
are bound to the same controller variable, and each edits the appropriate information
(either date or time). The example also shows a <a href="topic/wijmo.input.Calendar.Class.html"><span class="identifier">Calendar</span></a> control that can be
used to select the date with a single click.</p>
<p>The <b>wj-input-time</b> directive extends <a href="topic/wijmo.angular.WjComboBox.Class.html"><span class="identifier">WjComboBox</span></a> with the following attributes:</p>
<p><dl class="dl-horizontal">
  <dt>ng-model</dt>      <dd><code>@</code> Binds the control's <b>value</b> property using the ng-model Angular 
                         directive. Binding the property using the ng-model directive provides standard benefits 
                         like validation, adding the control's state to the form instance, and so on. To redefine 
                         properties on a control that is bound by the ng-model directive, use the wj-model-property 
                         attribute.</dd>
  <dt>wj-model-property</dt><dd><code>@</code> Specifies a control property that is bound to a scope using the <b>ng-model</b> directive.</dd>
  <dt>control</dt>       <dd><code>=</code> A reference to the <a href="topic/wijmo.input.InputDate.Class.html"><span class="identifier">InputDate</span></a> control created by this directive.</dd>
  <dt>format</dt>        <dd><code>@</code> The format used to display the selected time.</dd>
  <dt>mask</dt>          <dd><code>@</code> A mask used to validate the input as the user types (see <a href="topic/wijmo.input.InputMask.Class.html"><span class="identifier">InputMask</span></a>).</dd>
  <dt>max</dt>           <dd><code>@</code> The earliest valid time (a string in the format "hh:mm").</dd>
  <dt>min</dt>           <dd><code>@</code> The latest valid time (a string in the format "hh:mm").</dd>
  <dt>step</dt>          <dd><code>@</code> The number of minutes between entries in the drop-down list.</dd>
  <dt>value</dt>         <dd><code>=</code> The time being edited (as a Date object).</dd>
  <dt>value-changed</dt> <dd><code>&</code> The@see: valueChanged event handler.</dd>
</dl></p>
<p>If provided, the <b>min</b> and <b>max</b> attributes are strings in the format
"hh:mm". Technically, you can use any full date as defined in the W3C
<a href="http://tools.ietf.org/html/rfc3339" target="_blank">[RFC 3339]</a>, which is also the format 
used with regular HTML5 input elements.</p></div>
</div>
<div class="member-panel class members" ng-class="{ 'show-inherited' : ctx.showInherited, 'show-raisers' : ctx.showRaisers }">
</div>
