# Wijmo_Angular_Input.Wjcollectionviewnavigator

## Content

<div class="content__tsd">
						<div style="display:flex;justify-content:space-between;align-items:center">
							<h1>
								WjCollectionViewNavigator Class
							</h1>
						</div>
						<section class="tsd-comment">
							<div class="tsd-comment">
								<div class="lead">
									<p>AngularJS directive for an <a href="../interfaces/wijmo.icollectionview.html">ICollectionView</a> navigator element.</p>
								</div>
								<p>Use the <b>wj-collection-view-navigator</b> directive to add an element that allows users to
									navigate through the items in an <a href="../interfaces/wijmo.icollectionview.html">ICollectionView</a>.
									Note that directive and parameter names must be formatted as lower-case with dashes
								instead of camel-case. For example:</p>
								<pre>Here is a CollectionViewNavigator:&lt;/p&gt;
&lt;wj-collection-view-navigator
  cv="myCollectionView"&gt;
&lt;/wj-collection-view-navigator&gt;</pre>
								<p><a href="https://jsfiddle.net/Wijmo5/s8tT4/" target="_blank">Example</a></p>
								<p>This example creates a CollectionView with 100,000 items and 20 items per page.
									It defines a navigator to select the current page, another to select the current item,
								and shows the data in a <a href="wijmo_grid.flexgrid.html">FlexGrid</a>.</p>
								<p>The <b>wj-collection-view-navigator</b> directive has a single attribute:</p>
								<dl class="dl-horizontal">
									<dt>cv</dt>  <dd><code>=</code> A reference to the <a href="../interfaces/wijmo.icollectionview.html">ICollectionView</a> object to navigate.</dd>
								</dl>
							</div>
						</section>
						<section class="tsd-hierarchy">
							<h3>Heirarchy</h3>
							<ul class="tsd-hierarchy">
								<li>
									<span class="tsd-signature-type">WjDirective</span>
									<ul class="tsd-hierarchy">
										<li>
											<span class="target">WjCollectionViewNavigator</span>
										</li>
									</ul>
								</li>
							</ul>
						</section>
					</div>