案例：ionic案例     状态：可编辑再运行    进入竖版
 运行结果　
​x
 
1
<!DOCTYPE html>
2
<html>
3
  <head>
4
    <meta charset="utf-8">
5
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
6
    <title>W3xue教程(w3xue.com)</title>
7
    <link href="/css/ionic1.0.1/ionic.min.css" rel="stylesheet">
8
    <script src="/js/ionic1.0.1/ionic.bundle.min.js"></script>
9
    <script type="text/javascript">
10
    angular.module('starter', ['ionic'])
11
​
12
    .run(function($ionicPlatform) {
13
      $ionicPlatform.ready(function() {
14
        // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
15
        // for form inputs)
16
        if(window.cordova && window.cordova.plugins.Keyboard) {
17
          cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
18
        }
19
        if(window.StatusBar) {
20
          StatusBar.styleDefault();
21
        }
22
      });
23
    })
24
​
25
    .controller( 'actionsheetCtl',['$scope',function($scope){
26
​
27
        $scope.onDragUp=function(){
28
            console.log("onDragUp")
29
        }
30
​
31
        $scope.onDragDown=function(){
32
            console.log("onDragDown")
33
        }
34
​
35
        $scope.onDragRight=function(){
36
            console.log("onDragRight")
37
        }
38
​
39
        $scope.onDragLeft=function(){
40
            console.log("onDragLeft")
41
        }
42
​
43
    }])
44
  </script>
45
  </head>
46
    <body ng-app="starter" ng-controller="actionsheetCtl" >
47
        <button on-drag-up="onDragUp()" class="button">onDragUp</button>
48
        <button on-drag-down="onDragDown()" class="button">onDragDown</button>