Collection Repeat

• Replacement for Angular's ng-repeat
• Inspired by iOS’s UICollectionView
• Scroll through thousands of items
• Only renders the viewable items
• Smooth scrolling!

<div class="list">
  <div collection-repeat="c in contacts">
    <h2>{{ c.name }}</h2>
    <p>{{ c.email }}</p>
  </div>
</div>

Navigation

• Uses AngularUI Router
• Shows back button when possible
• Transitions follow direction of nav
• Updates the app's URL
• Multi-history stack

<ion-tabs>

  <ion-tab title="Home" icon="ion-ios-home">
    <ion-nav-view name="home"></ion-nav-view>
  </ion-tab>

  <ion-tab title="About" icon="ion-ios-information">
    <ion-nav-view name="about"></ion-nav-view>
  </ion-tab>

  <ion-tab title="Contact" icon="ion-ios-world">
    <ion-nav-view name="contact"></ion-nav-view>
  </ion-tab>

</ion-tabs>

Swipe To Go Back

• Swipe back to previous view
• Interactive transition
• Benefit of cached views
• Still updates the app's URL
• WebView (Cordova) only

Other Components

• Side Menus
• Actionsheet
• Modal
• Pull To Refresh
• Slidebox
• Infinite Scroll
• Swipeable List Options
• Popup
• Popover
• Loading Overlay
• Inputs
• Buttons
• etc.

Spinners

• Animated SVGs
• More than just rotating icons
• Defaults to platform's spinner
• Style with CSS

<ion-spinner></ion-spinner>

<ion-spinner icon="dots"></ion-spinner>

<ion-spinner class="spinner-light"></ion-spinner>