<!-- this file was generated by DirectiveDocs from 'wijDctv.js' -->

<h2 class='text-info'>Module 'wij'</h2>
<p>
AngularJS directives for Wijmo components (in addition to the ones provided in angular.wijmo.js and defined in the 'wijmo' module).
<p>
<p>This module is defined in file <i>wijDctv.js</i>.</p>
<h4 class='badge badge-info'>Directives</h4>
<p>This module includes the following directives:</p>
<div class='well'>
<a class='label label-info' onclick='showTopic("wij-accordion")'>accordion</a>
<a class='label label-info' onclick='showTopic("wij-accordion-item")'>accordion-item</a>
<a class='label label-info' onclick='showTopic("wij-autocomplete")'>autocomplete</a>
<a class='label label-info' onclick='showTopic("wij-bullet")'>bullet</a>
<a class='label label-info' onclick='showTopic("wij-bullet-legend")'>bullet-legend</a>
<a class='label label-info' onclick='showTopic("wij-chart")'>chart</a>
<a class='label label-info' onclick='showTopic("wij-checkbox")'>checkbox</a>
<a class='label label-info' onclick='showTopic("wij-combobox")'>combobox</a>
<a class='label label-info' onclick='showTopic("wij-gauge")'>gauge</a>
<a class='label label-info' onclick='showTopic("wij-grid")'>grid</a>
<a class='label label-info' onclick='showTopic("wij-grid-column")'>grid-column</a>
<a class='label label-info' onclick='showTopic("wij-inputdate")'>inputdate</a>
<a class='label label-info' onclick='showTopic("wij-inputnumber")'>inputnumber</a>
<a class='label label-info' onclick='showTopic("wij-menu")'>menu</a>
<a class='label label-info' onclick='showTopic("wij-menu-item")'>menu-item</a>
<a class='label label-info' onclick='showTopic("wij-menu-separator")'>menu-separator</a>
<a class='label label-info' onclick='showTopic("wij-pluralize")'>pluralize</a>
<a class='label label-info' onclick='showTopic("wij-progressbar")'>progressbar</a>
<a class='label label-info' onclick='showTopic("wij-radio")'>radio</a>
<a class='label label-info' onclick='showTopic("wij-slider")'>slider</a>
<a class='label label-info' onclick='showTopic("wij-splitter")'>splitter</a>
<a class='label label-info' onclick='showTopic("wij-tab")'>tab</a>
<a class='label label-info' onclick='showTopic("wij-tab-item")'>tab-item</a>
<a class='label label-info' onclick='showTopic("wij-tooltip")'>tooltip</a>
</div>
<h4 class='badge badge-info'>Requires Wijmo</h4>
<p>To use any of the directives in this module, include the following code in your main html page:</p>
<pre>&lt;link href="http://cdn.wijmo.com/themes/aristo/jquery-wijmo.css"
type="text/css" rel="stylesheet" /&gt;
&lt;link href="http://cdn.wijmo.com/jquery.wijmo-pro.all.3.20131.2.min.css"
type="text/css" rel="stylesheet" /&gt;
&lt;script src="http://cdn.wijmo.com/jquery.wijmo-open.all.3.20131.2.min.js"
type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="http://cdn.wijmo.com/jquery.wijmo-pro.all.3.20131.2.js"
type="text/javascript"&gt;&lt;/script&gt;</pre>
<div ng:non-bindable>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-accordion'>wij-accordion</h3>
<div id='wij-accordion' class='collapse in'>
<ul>
<li>Creates an interface with collapsible items where one item is expanded at any time.</li>
<li>Contains <code>wij-accordion-item</code> elements, each with a 'header' attribute and its own content.</li>
</ul>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-accordion&gt;
   &lt;wij-accordion-item header="&lt;b&gt;ATL&lt;/b&gt; Atlanta, GA"&gt;
     &lt;div&gt;accordion item content...&lt;/div&gt;
   &lt;/wij-accordion-item&gt;
   &lt;wij-accordion-item header="&lt;b&gt;ORD&lt;/b&gt; Chicago, IL"&gt;
     &lt;div&gt;accordion item content...&lt;/div&gt;
   &lt;/wij-accordion-item&gt;
 &lt;/wij-accordion&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo accordion: <a href='http://wijmo.com/wiki/index.php/Accordion#API'>http://wijmo.com/wiki/index.php/Accordion#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-accordion-item'>wij-accordion-item</h3>
<div id='wij-accordion-item' class='collapse in'>
<ul>
<li>Provides content for <code>wij-accordion</code> elements.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>header</code></dt>
<dd>Html content that appears in the header.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-accordion&gt;
   &lt;wij-accordion-item header="&lt;b&gt;ATL&lt;/b&gt; Atlanta, GA"&gt;
     &lt;div&gt;accordion item content...&lt;/div&gt;
   &lt;/wij-accordion-item&gt;
   &lt;wij-accordion-item header="&lt;b&gt;ORD&lt;/b&gt; Chicago, IL"&gt;
     &lt;div&gt;accordion item content...&lt;/div&gt;
   &lt;/wij-accordion-item&gt;
 &lt;/wij-accordion&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo accordion: <a href='http://wijmo.com/wiki/index.php/Accordion#API'>http://wijmo.com/wiki/index.php/Accordion#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-autocomplete'>wij-autocomplete</h3>
<div id='wij-autocomplete' class='collapse in'>
<ul>
<li>Input element with auto-complete (shows list as the user types).</li>
<li>Implemented using the jQuery autocomplete widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>minLength</code></dt>
<dd>Minimum length of input to start looking for matches.</dd>
<dt><code>source</code></dt>
<dd>List of valid choices (array of <code>{ value, label }</code> objects).</dd>
<dt><code>sourceFn</code></dt>
<dd>Source function (takes two arguments, 'request' and 'response'). This is a <b>function</b> binding attribute.</dd>
<dt><code>value</code></dt>
<dd>Current value. This is a <b>two-way</b> binding attribute.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-autocomplete
   value="trip.from"
   min-length="2"
   source-fn="taSource"&gt;
 &lt;/wij-autocomplete&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>jQuery autocomplete: <a href='http://api.jqueryui.com/autocomplete'>http://api.jqueryui.com/autocomplete</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-bullet'>wij-bullet</h3>
<div id='wij-bullet' class='collapse in'>
<ul>
<li>Implements a bullet graph as described in Stephen Few's "Information Dashboard Design" book.</li>
<li>The chart consists of bars that show different performance levels as well as target and actual values.</li>
<li>Implemented using the wijlineargauge widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>actual</code></dt>
<dd>Actual level.</dd>
<dt><code>good</code></dt>
<dd>Level considered good.</dd>
<dt><code>max</code></dt>
<dd>Maximum value to use for scaling the bullet graph.</dd>
<dt><code>poor</code></dt>
<dd>Level considered poor (less than satisfgatory).</dd>
<dt><code>satisfactory</code></dt>
<dd>Level considered satisfactory (less than good).</dd>
<dt><code>target</code></dt>
<dd>Target level.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-bullet
   actual="{{ap.vol2011/1000000}}"
   poor="5" satisfactory="15" good="18" target="20" max="50" &gt;&lt;/wij-bullet&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Bullet graph design spec: <a href='http://www.perceptualedge.com/articles/misc/Bullet_Graph_Design_Spec.pdf'>http://www.perceptualedge.com/articles/misc/Bullet_Graph_Design_Spec.pdf</a></li>
<li>Stephen Few's book: <a href='http://www.amazon.com/Information-Dashboard-Design-Effective-Communication/dp/0596100167'>http://www.amazon.com/Information-Dashboard-Design-Effective-Communication/dp/0596100167</a></li>
<li>Wijmo: <a href='http://wijmo.com'>http://wijmo.com</a></li>
<li>Wijmo linear gauge: <a href='http://wijmo.com/wiki/index.php/Lineargauge#API'>http://wijmo.com/wiki/index.php/Lineargauge#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-bullet-legend'>wij-bullet-legend</h3>
<div id='wij-bullet-legend' class='collapse in'>
<ul>
<li>Shows a static legend describing the meaning of the bullet graph ranges.</li>
</ul>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-bullet-legend class="text-info text-right" style="float:right"&gt;&lt;/wij-bullet-legend&gt;</pre>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-chart'>wij-chart</h3>
<div id='wij-chart' class='collapse in'>
<ul>
<li>Shows charts of different types.</li>
<li>Implemented using the wijmo chart widgets.</li>
<li>Uses a simple data format common to all chart types.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>data</code></dt>
<dd>Chart data: an array of arrays; the first column contains the x values and the remaining columns contain one series each (for most chart types).</dd>
<dt><code>height</code></dt>
<dd>Height of the chart in pixels.</dd>
<dt><code>interval</code></dt>
<dd>Interval between grid lines.</dd>
<dt><code>legend</code></dt>
<dd>Whether to show a legend (by default, a legend is shown if there are more than one series).</dd>
<dt><code>max</code></dt>
<dd>Maximum value to show on the Y axis.</dd>
<dt><code>min</code></dt>
<dd>Minimum value to show on the Y axis.</dd>
<dt><code>titleX</code></dt>
<dd>Title for the X (category) axis.</dd>
<dt><code>titleY</code></dt>
<dd>Title for the Y (value) axis.</dd>
<dt><code>type</code></dt>
<dd>Chart type: area, bar, bubble, column, line, pie, or scatter.</dd>
<dt><code>width</code></dt>
<dd>Width of the chart in pixels.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-chart
   class="span10" height="600"
   type="{{chartType}}"
   data="{{getChartData()}}"
   min="0"
   title-x="Airport"
   title-y="Pax (millions)" &gt;
 &lt;/wij-chart&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo: <a href='http://wijmo.com'>http://wijmo.com</a></li>
<li>Wijmo line chart: <a href='http://wijmo.com/wiki/index.php/Linechart#API'>http://wijmo.com/wiki/index.php/Linechart#API</a></li>
<li>Wijmo bar chart: <a href='http://wijmo.com/wiki/index.php/Barchart#API'>http://wijmo.com/wiki/index.php/Barchart#API</a></li>
<li>Wijmo pie chart: <a href='http://wijmo.com/wiki/index.php/Piechart#API'>http://wijmo.com/wiki/index.php/Piechart#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-checkbox'>wij-checkbox</h3>
<div id='wij-checkbox' class='collapse in'>
<ul>
<li>Check-box widget.</li>
<li>Implemented using the Wijmo wijcheckbox widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>checked</code></dt>
<dd>Gets a value that determines whether the checkbox is currently checked.</dd>
<dt><code>click</code></dt>
<dd>Function called when the user changes the value of the checkbox. This is a <b>function</b> binding attribute.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;label&gt;&lt;wij-checkbox click="toggleTripExtra(1)" checked="{{getTripExtra(1)}}"&gt;&lt;/wij-checkbox&gt; Hotel&lt;/label&gt;
 &lt;label&gt;&lt;wij-checkbox click="toggleTripExtra(2)" checked="{{getTripExtra(2)}}"&gt;&lt;/wij-checkbox&gt; Car&lt;/label&gt;
 &lt;label&gt;&lt;wij-checkbox click="toggleTripExtra(4)" checked="{{getTripExtra(4)}}"&gt;&lt;/wij-checkbox&gt; Insurance&lt;/label&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijcheckbox: <a href='http://wijmo.com/wiki/index.php/CheckBox#API'>http://wijmo.com/wiki/index.php/CheckBox#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-combobox'>wij-combobox</h3>
<div id='wij-combobox' class='collapse in'>
<ul>
<li>Input element with auto-complete (shows list as the user types).</li>
<li>Implemented using the Wijmo wijcombobox widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>source</code></dt>
<dd>List of valid choices (array of <code>{ value, label }</code> objects).</dd>
<dt><code>value</code></dt>
<dd>Current value. This is a <b>two-way</b> binding attribute.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-combobox
   value="trip.from"
   source="{{getComboItems()}}" &gt;
 &lt;/wij-combobox&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijcombobox: <a href='http://wijmo.com/wiki/index.php/Combobox#API'>http://wijmo.com/wiki/index.php/Combobox#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-gauge'>wij-gauge</h3>
<div id='wij-gauge' class='collapse in'>
<ul>
<li>Shows a streamlined radial gauge with min, max, and actual value.</li>
<li>Implemented using the wijradialgauge widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>fill</code></dt>
<dd>Color of the filled area (from 'start' to 'value').</dd>
<dt><code>gauge</code></dt>
<dd>Color of the gauge display.</dd>
<dt><code>max</code></dt>
<dd>Gauge maximum (end) value.</dd>
<dt><code>min</code></dt>
<dd>Gauge minimum (start) value.</dd>
<dt><code>showLimits</code></dt>
<dd>Whether to show the minimum and maximum values below the gauge.</dd>
<dt><code>stroke</code></dt>
<dd>Color of the gauge outline.</dd>
<dt><code>targetFill</code></dt>
<dd>Color of the filled area if 'value' is equal to or greater than 'targetValue'.</dd>
<dt><code>targetValue</code></dt>
<dd>Target value for the gauge.</dd>
<dt><code>value</code></dt>
<dd>Value indicated by the gauge pointer.</dd>
<dt><code>width</code></dt>
<dd>Gauge width in pixels.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-gauge
     value="{{product.sales.qThis}}"
     max="{{product.sales.max}}"
     fill="red" gauge="#e0e0e0"
     target-value="{{product.levels.target}}" target-fill="green" &gt;
     &lt;/wij-gauge&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo: <a href='http://wijmo.com'>http://wijmo.com</a></li>
<li>Wijmo radial gauge chart: <a href='http://wijmo.com/wiki/index.php/Radialgauge#API'>http://wijmo.com/wiki/index.php/Radialgauge#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-grid'>wij-grid</h3>
<div id='wij-grid' class='collapse in'>
<ul>
<li>Simple data grid with sorting and grouping.</li>
<li>Implemented using the Wijmo wijgrid widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>allowWrapping</code></dt>
<dd>Whether text in grid cells should be allowed to wrap within cells.</dd>
<dt><code>data</code></dt>
<dd>List of items to bind to. This is a <b>two-way</b> binding attribute.</dd>
<dt><code>frozenColumns</code></dt>
<dd>Number of non-scrollable columns.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-grid
   style="height:400px;overflow:scroll;"
   data="airports"
   frozen-columns="1"&gt;
   &lt;wij-grid-column binding="city"&gt;&lt;/wij-grid-column&gt;
   &lt;wij-grid-column binding="state" width="80" aggregate="count"
     group="true" group-header="{0}: {2} airport(s)"&gt;&lt;/wij-grid-column&gt;
   &lt;wij-grid-column binding="vol2011" header="Traffic"
     format="n0" width="100" aggregate="sum"&gt;&lt;/wij-grid-column&gt;
 &lt;/wij-grid&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijgrid: <a href='http://wijmo.com/wiki/index.php/Grid#API'>http://wijmo.com/wiki/index.php/Grid#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-grid-column'>wij-grid-column</h3>
<div id='wij-grid-column' class='collapse in'>
<ul>
<li>Represents a column in a wij-grid directive.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>aggregate</code></dt>
<dd>Aggregate to display in group header rows for this column ("none", "count", "sum", "average", "min", "max", "std", "stdPop", "var", "varPop", or "custom").</dd>
<dt><code>binding</code></dt>
<dd>Property shown in this column.</dd>
<dt><code>format</code></dt>
<dd>Format used to display numeric values in this column.</dd>
<dt><code>group</code></dt>
<dd>Whether items should be grouped by the values in this column.</dd>
<dt><code>groupHeader</code></dt>
<dd>Text to display in the group header rows ("{0}", "{1}", and "{2}" are replaced with the value being grouped on, the column header, and the aggregate value).</dd>
<dt><code>header</code></dt>
<dd>Column header content.</dd>
<dt><code>width</code></dt>
<dd>Column width in pixels.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-grid
   style="height:400px;overflow:scroll;"
   data="airports"
   frozen-columns="1"&gt;
   &lt;wij-grid-column binding="city"&gt;&lt;/wij-grid-column&gt;
   &lt;wij-grid-column binding="state" width="80" aggregate="count"
     group="true" group-header="{0}: {2} airport(s)"&gt;&lt;/wij-grid-column&gt;
   &lt;wij-grid-column binding="vol2011" header="Traffic"
     format="n0" width="100" aggregate="sum"&gt;&lt;/wij-grid-column&gt;
 &lt;/wij-grid&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijgrid: <a href='http://wijmo.com/wiki/index.php/Grid#API'>http://wijmo.com/wiki/index.php/Grid#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-inputdate'>wij-inputdate</h3>
<div id='wij-inputdate' class='collapse in'>
<ul>
<li>Date input with a month calendar drop-down.</li>
<li>Implemented using the Wijmo wijinputdate widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>dropDown</code></dt>
<dd>Whether to show a drop-down calendar (true by default).</dd>
<dt><code>format</code></dt>
<dd>Format used to display the date ("d" by default, short date). See the <a href="http://wijmo.com/wiki/index.php/InputDate#API">wijinputdate documentation for more options.</a>).</dd>
<dt><code>maxDate</code></dt>
<dd>Maximum date that can be selected.</dd>
<dt><code>minDate</code></dt>
<dd>Minimum date that can be selected.</dd>
<dt><code>value</code></dt>
<dd>Current value (selected date). This is a <b>two-way</b> binding attribute.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-inputdate value="trip.returnDate" minDate="{{trip.departDate}}"&gt;
 &lt;/wij-inputdate&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijinputdate: <a href='http://wijmo.com/wiki/index.php/InputDate#API'>http://wijmo.com/wiki/index.php/InputDate#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-inputnumber'>wij-inputnumber</h3>
<div id='wij-inputnumber' class='collapse in'>
<ul>
<li>Numeric input with range-checking and spinners.</li>
<li>Implemented using the Wijmo wijinputnumber widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>decimalPlaces</code></dt>
<dd>Number of decimal places to show (defaults to zero).</dd>
<dt><code>groupSeparators</code></dt>
<dd>Whether to show thousand separators (defaults to true).</dd>
<dt><code>increment</code></dt>
<dd>Increment applied by the spinner buttons (defaults to one).</dd>
<dt><code>max</code></dt>
<dd>Maximum acceptable value (defaults to 1000000000).</dd>
<dt><code>min</code></dt>
<dd>Minimum acceptable value (defaults to zero).</dd>
<dt><code>spinner</code></dt>
<dd>Whether to show spinner buttons (defaults to true).</dd>
<dt><code>value</code></dt>
<dd>Numeric value editable by the user. This is a <b>two-way</b> binding attribute.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre>  &lt;wij-inputnumber value="trip.adults" max="5" &gt;
 &lt;/wij-inputnumber&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijinputnumber: <a href='http://wijmo.com/wiki/index.php/Inputnumber#API'>http://wijmo.com/wiki/index.php/Inputnumber#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-menu'>wij-menu</h3>
<div id='wij-menu' class='collapse in'>
<ul>
<li>Creates a menu composed of a hierarchical list of wij-menu-item elements.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>animation</code></dt>
<dd>Animation to use when showing menu items. Valid options are: null (the default), 'slide', 'puff', 'fold', 'fade', etc.</dd>
<dt><code>trigger</code></dt>
<dd>When to open the menus. Valid options are: 'mouseenter' (the default), 'click', 'dbclick', or 'rtclick'.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-menu&gt;
   &lt;wij-menu-item header="Navigate" &gt;
     &lt;wij-menu-item header="Home"        href="#/home"&gt;&lt;/wij-menu-item&gt;
     &lt;wij-menu-item header="Input"       href="#/wijmo/input"&gt;&lt;/wij-menu-item&gt;
     &lt;wij-menu-separator&gt;&lt;/wij-menu-separator&gt;
     &lt;wij-menu-item header="Commands"&gt;
       &lt;wij-menu-item header="Home"    click="say('home: ' + {{14*14}})"&gt;&lt;/wij-menu-item&gt;
       &lt;wij-menu-item header="Input"   click="say('input: ' + {{15*15}})"&gt;&lt;/wij-menu-item&gt;
       &lt;wij-menu-item header="Layout"  click="say('layout: ' + {{16*16}})"&gt;&lt;/wij-menu-item&gt;
     &lt;/wij-menu-item&gt;
   &lt;/wij-menu-item&gt;
 &lt;/wij-menu&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijmenu: <a href='http://wijmo.com/wiki/index.php/Menu'>http://wijmo.com/wiki/index.php/Menu</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-menu-item'>wij-menu-item</h3>
<div id='wij-menu-item' class='collapse in'>
<ul>
<li>Represents an item in a wij-menu directive.</li>
</ul>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-menu&gt;
   &lt;wij-menu-item header="Navigate" &gt;
     &lt;wij-menu-item header="Home"        href="#/home"&gt;&lt;/wij-menu-item&gt;
     &lt;wij-menu-item header="Input"       href="#/wijmo/input"&gt;&lt;/wij-menu-item&gt;
     &lt;wij-menu-separator&gt;&lt;/wij-menu-separator&gt;
     &lt;wij-menu-item header="Commands"&gt;
       &lt;wij-menu-item header="Home"    click="say('home: ' + {{14*14}})"&gt;&lt;/wij-menu-item&gt;
       &lt;wij-menu-item header="Input"   click="say('input: ' + {{15*15}})"&gt;&lt;/wij-menu-item&gt;
       &lt;wij-menu-item header="Layout"  click="say('layout: ' + {{16*16}})"&gt;&lt;/wij-menu-item&gt;
     &lt;/wij-menu-item&gt;
   &lt;/wij-menu-item&gt;
 &lt;/wij-menu&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijmenu: <a href='http://wijmo.com/wiki/index.php/Menu'>http://wijmo.com/wiki/index.php/Menu</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-menu-separator'>wij-menu-separator</h3>
<div id='wij-menu-separator' class='collapse in'>
<ul>
<li>Represents a separator between groups of items a wij-menu directive.</li>
</ul>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-menu&gt;
   &lt;wij-menu-item header="Navigate" &gt;
     &lt;wij-menu-item header="Home"        href="#/home"&gt;&lt;/wij-menu-item&gt;
     &lt;wij-menu-item header="Input"       href="#/wijmo/input"&gt;&lt;/wij-menu-item&gt;
     &lt;wij-menu-separator&gt;&lt;/wij-menu-separator&gt;
     &lt;wij-menu-item header="Commands"&gt;
       &lt;wij-menu-item header="Home"    click="say('home: ' + {{14*14}})"&gt;&lt;/wij-menu-item&gt;
       &lt;wij-menu-item header="Input"   click="say('input: ' + {{15*15}})"&gt;&lt;/wij-menu-item&gt;
       &lt;wij-menu-item header="Layout"  click="say('layout: ' + {{16*16}})"&gt;&lt;/wij-menu-item&gt;
     &lt;/wij-menu-item&gt;
   &lt;/wij-menu-item&gt;
 &lt;/wij-menu&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijmenu: <a href='http://wijmo.com/wiki/index.php/Menu'>http://wijmo.com/wiki/index.php/Menu</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-pluralize'>wij-pluralize</h3>
<div id='wij-pluralize' class='collapse in'>
<ul>
<li>Pluralize directive similar to ng-pluralize, but with simpler markup.</li>
<li>Spells out numbers less than or equal to 10 (one, two, three, ..., 11, 12, 13, ...).</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>count</code></dt>
<dd>Quantity to pluralize. This is a <b>two-way</b> binding attribute.</dd>
<dt><code>plural</code></dt>
<dd>String to use when the count is greater than one (e.g. 42 'leaves').</dd>
<dt><code>singular</code></dt>
<dd>String to use when the count is one (e.g. one 'leaf').</dd>
<dt><code>zero</code></dt>
<dd>String to use when the count is zero (e.g. 'empty').</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-pluralize count="trip.adults" singular="adult" zero="nobody"&gt;&lt;/wij-pluralize&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>ng-pluralize: <a href='http://docs.angularjs.org/api/ng.directive:ngPluralize'>http://docs.angularjs.org/api/ng.directive:ngPluralize</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-progressbar'>wij-progressbar</h3>
<div id='wij-progressbar' class='collapse in'>
<ul>
<li>Provides visual feedback to indicate a process is active.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>indeterminate</code></dt>
<dd>Whether the progress bar is indeterminate (should show animation but no percentages).</dd>
<dt><code>value</code></dt>
<dd>Percentage complete (between zero and 100).</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-progressbar indeterminate="true" ng-show="isLoading"&gt;&lt;/wij-progressbar&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo progress bar: <a href='http://wijmo.com/wiki/index.php/Progressbar#API'>http://wijmo.com/wiki/index.php/Progressbar#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-radio'>wij-radio</h3>
<div id='wij-radio' class='collapse in'>
<ul>
<li>Radio button widget.</li>
<li>Implemented using the Wijmo wijradio widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>checked</code></dt>
<dd>Gets a value that determines whether the radio button is currently checked.</dd>
<dt><code>click</code></dt>
<dd>Function called when the user changes the value of the radio button. This is a <b>function</b> binding attribute.</dd>
<dt><code>name</code></dt>
<dd>Name of the group that this radio button belongs to.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;label&gt;&lt;wij-radio name="tc" click="setTripClass('economy')" checked="{{trip.class=='economy'}}"&gt;&lt;/wij-radio&gt; Economy&lt;/label&gt;
 &lt;label&gt;&lt;wij-radio name="tc" click="setTripClass('business')" checked="{{trip.class=='business'}}"&gt;&lt;/wij-radio&gt; Business&lt;/label&gt;
 &lt;label&gt;&lt;wij-radio name="tc" click="setTripClass('first')" checked="{{trip.class=='first'}}"&gt;&lt;/wij-radio&gt; First&lt;/label&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijradio: <a href='http://wijmo.com/wiki/index.php/Radio#API'>http://wijmo.com/wiki/index.php/Radio#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-slider'>wij-slider</h3>
<div id='wij-slider' class='collapse in'>
<ul>
<li>Slider widget used to visually edit numeric values.</li>
<li>Implemented using the Wijmo wijslider widget.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>max</code></dt>
<dd>Maximum value on the slider.</dd>
<dt><code>min</code></dt>
<dd>Minimum value on the slider.</dd>
<dt><code>value</code></dt>
<dd>Current value displayed on the slider. This is a <b>two-way</b> binding attribute.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-slider
   value="trip.adults"
   min="0" max="5" &gt;
 &lt;/wij-slider&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo wijradio: <a href='http://wijmo.com/wiki/index.php/Slider'>http://wijmo.com/wiki/index.php/Slider</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-splitter'>wij-splitter</h3>
<div id='wij-splitter' class='collapse in'>
<ul>
<li>Divides an element into two panels separated by a movable bar.</li>
<li>Supports horizontal and vertical orientations.</li>
<li>One of the elements can optionally be collapsed.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>collapsingPanel</code></dt>
<dd>Which panel should collapse when the user clicks the expander element. Possible values are 'panel1' (the default), 'panel2', or null.</dd>
<dt><code>orientation</code></dt>
<dd>Orientation of the splitter bar. Possible values are 'vertical' (the default) or 'horizontal'.</dd>
<dt><code>splitterDistance</code></dt>
<dd>Distance in pixels between the edge of the widget and the splitter bar (default is 100).</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-splitter splitter-distance="250" style="height:300px;border:2px solid grey" &gt;
   &lt;div&gt;Panel on the left.&lt;/div&gt;
   &lt;div&gt;Panel on the right.&lt;/div&gt;
 &lt;/wij-splitter&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo splitter: <a href='http://wijmo.com/wiki/index.php/Splitter#API'>http://wijmo.com/wiki/index.php/Splitter#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-tab'>wij-tab</h3>
<div id='wij-tab' class='collapse in'>
<ul>
<li>Creates a tabbed interface.</li>
<li>Contains <code>wij-tab-item</code> elements, each with a 'header' attribute and its own content.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>alignment</code></dt>
<dd>Determines the position of the tabs (top, bottom, left, or right of the content).</dd>
<dt><code>collapsible</code></dt>
<dd>Determines whether users can collapse tabs by clicking them when they are selected.</dd>
<dt><code>scrollable</code></dt>
<dd>Determines whether tabs should wrap or scroll when they exceed the available width.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-tab&gt;
   &lt;wij-tab-item header="First Tab"&gt;
     &lt;div&gt;This is the content of the first tab.&lt;/div&gt;
   &lt;/wij-tab-item&gt;
   &lt;wij-tab-item header="Second Tab"&gt;
     &lt;div&gt;This is the content of the second tab.&lt;/div&gt;
   &lt;/wij-tab-item&gt;
 &lt;/wij-tab&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo tabs: <a href='http://wijmo.com/wiki/index.php/Tabs#API'>http://wijmo.com/wiki/index.php/Tabs#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-tab-item'>wij-tab-item</h3>
<div id='wij-tab-item' class='collapse in'>
<ul>
<li>Provides content for <code>wij-tab</code> elements.</li>
<li>Adapted from http://angularjs.org/#components-js.</li>
</ul>
<h4 class='badge badge-info'>Attributes</h4>
<dl class='dl-horizontal'>
<dt><code>header</code></dt>
<dd>Html content that appears in the tab.</dd>
</dl>
<h4 class='badge badge-info'>Example</h4>
<pre> &lt;wij-tab&gt;
   &lt;wij-tab-item header="First Tab"&gt;
     &lt;div&gt;This is the content of the first tab.&lt;/div&gt;
   &lt;/wij-tab-item&gt;
   &lt;wij-tab-item header="Second Tab"&gt;
     &lt;div&gt;This is the content of the second tab.&lt;/div&gt;
   &lt;/wij-tab-item&gt;
 &lt;/wij-tab&gt;</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo tabs: <a href='http://wijmo.com/wiki/index.php/Tabs#API'>http://wijmo.com/wiki/index.php/Tabs#API</a></li>
</ul>
</div>
<h3 class='alert alert-info' type='button' data-toggle='collapse' data-target='#wij-tooltip'>wij-tooltip</h3>
<div id='wij-tooltip' class='collapse in'>
<ul>
<li>Provides balloon tooltips with HTML content.</li>
</ul>
<h4 class='badge badge-info'>Example</h4>
<pre> This paragraph contains a
 &lt;i wij-tooltip="Tooltip content (&lt;b&gt;HTML&lt;/b&gt; is allowed here)."&gt;
  rich tooltip
 &lt;/i&gt;.</pre>
<h4 class='badge badge-info'>See Also</h4>
<ul>
<li>Wijmo tooltip: <a href='http://wijmo.com/wiki/index.php/Tooltip#API'>http://wijmo.com/wiki/index.php/Tooltip#API</a></li>
</ul>
</div>
</div>
<script>
    function showTopic(id) { $('#' + id).prev()[0].scrollIntoView(); }
</script>