$ionicModal 添加动画效果

$ionicModal, 只提供了slide-in-up一个动画效果

.slide-in-right {
   -webkit-transform: translateX(-100%);
   transform: translateX(100%); 
}
.slide-in-right.ng-enter, .slide-in-right > .ng-enter {
  -webkit-transition: all cubic-bezier(0.1, 0.7, 0.1, 1) 400ms;
   transition: all cubic-bezier(0.1, 0.7, 0.1, 1) 400ms;
}      
.slide-in-right.ng-enter-active, .slide-in-right > .ng-enter-active {
   -webkit-transform: translateX(0);
   transform: translateX(0); 
} 
.slide-in-right.ng-leave, .slide-in-right > .ng-leave {
  -webkit-transition: all ease-in-out 250ms;
   transition: all ease-in-out 250ms; 
}
.slide-in-left {
   -webkit-transform: translateX(-100%);
   transform: translateX(100%); 
}
.slide-in-left.ng-enter, .slide-in-left > .ng-enter {
  -webkit-transition: all cubic-bezier(0.1, 0.7, 0.1, 1) 400ms;
   transition: all cubic-bezier(0.1, 0.7, 0.1, 1) 400ms;
}      
.slide-in-left.ng-enter-active, .slide-in-left > .ng-enter-active {
   -webkit-transform: translateX(0);
   transform: translateX(0); 
} 
.slide-in-left.ng-leave, .slide-in-left > .ng-leave {
  -webkit-transition: all ease-in-out 250ms;
   transition: all ease-in-out 250ms; 
}

用法

$ionicModal.fromTemplateUrl('templates/modal-menus.html', {
        scope: $scope,
        animation:'slide-in-right'
      }).then(function(modal) {
        $scope.modal = modal;
        $scope.modal.show();
      });