selectPage = function(index) {
        var children = $element[0].children;
        var length = children.length;
        for(var i = 0; i < length; i++) {
          if(i == index) {
            children[i].classList.add('active');
          } else {
            children[i].classList.remove('active');
          }
        }
      }
@ngdoc directive
@name ionSlideBox
@module ionic
@restrict E
@controller ionicSlideBox as $scope.$ionicSlideBoxController
@description
The Slide Box is a multi-page container where each page can be swiped or dragged between:

![SlideBox](http://ionicframework.com.s3.amazonaws.com/docs/controllers/slideBox.gif)

@usage
```html
<ion-slide-box>
  <ion-slide>
    <div class="box blue"><h1>BLUE</h1></div>
  </ion-slide>
  <ion-slide>
    <div class="box yellow"><h1>YELLOW</h1></div>
  </ion-slide>
  <ion-slide>
    <div class="box pink"><h1>PINK</h1></div>
  </ion-slide>
</ion-slide-box>
```

@param {string=} controller-bind The scope variable to bind this slide box's
{@link ionic.controller:ionicSlideBox ionicSlideBox controller} to.
Default: $scope.$ionicSlideBoxController.
@param {boolean=} does-continue Whether the slide box should automatically slide.
@param {number=} slide-interval How many milliseconds to wait to change slides (if does-continue is true). Defaults to 4000.
@param {boolean=} show-pager Whether a pager should be shown for this slide box.
@param {boolean=} disable-scroll Whether to disallow scrolling/dragging of the slide-box content.
@param {expression=} on-slide-changed Expression called whenever the slide is changed.
@param {expression=} active-slide Model to bind the current slide to.