ionic loading(加载动作)

1、Html

<ion-header-bar class="bar bar-header bar-light bar-calm">
    <button class="button button-icon icon ion-navicon"></button>
    <ion-title class="bar-calm">腾讯新闻</ion-title>
</ion-header-bar>

<ion-content>
    <button class="button button-positive" ng-click="click()">弹出Loading窗口</button>
    <button class="button button-calm" ng-click="clickLoading()">弹出Loading窗口</button>
    <ion-list>
        <ion-item ng-repeat="stooge in stooges" href="#">{{stooge.name}}</ion-item>
    </ion-list>
</ion-content>

2、Controller

appCntrollers.controller('ManageLoadingCtrl', function ($scope, $timeout, $ionicLoading) {
    $scope.click = function () {
        $ionicLoading.show({
            template: 'Loading...',
        });

        $timeout(function () {
            $ionicLoading.hide();
        }, 2000);
    }

    $scope.clickLoading = function () {
        $ionicLoading.show({
            content: 'Loading',
            animation: 'fade-in',
            showBackdrop: true,
            maxWidth: 200,
            showDelay: 0
        });

        $timeout(function () {
            $ionicLoading.hide();
            $scope.stooges = [
                { name: 'Moe' },
                { name: 'Larry' },
                { name: 'Curly' }
            ];
        }, 2000);
    }
})

3、效果图