inoic请求数据与loading的显示隐藏

来源：互联网发布：java中的接口定义编辑：程序博客网时间：2024/06/06 19:53
<!DOCTYPE HTML><html><head>    <meta http-equiv="Content-Type" content="text/html" charset="utf-8">    <meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=no" />     <title>无标题文档</title>     <link href="../lib/ionic/css/ionic.min.css" rel="stylesheet">   <script src="../lib/ionic/js/ionic.bundle.min.js"></script></head><body ng-app="myApp"><div ng-controller="firstController">    <ul class="list">        <li class="item" ng-repeat="item in items">{{item}}</li>    </ul></div><script>var app = angular.module('myApp', ['ionic'])app.config(function($httpProvider) {  $httpProvider.interceptors.push(function($rootScope) {//$rootScope全局变量    return {      request: function(config) {//请求数据，显示loading        $rootScope.$broadcast('loading:show')//$broadcast广播给所有控制器。        return config      },      response: function(response) {//响应数据之后，关闭loading        $rootScope.$broadcast('loading:hide')        return response      }    }  })})app.service("service01",function($http){//service自定义服务，所有逻辑处理数据都放里面。    //可以用当前的this配置逻辑shu'j    var _name='';    this.setName=function(name){        _name=name;    };    this.getName=function(){        return _name;    };    this.getData = function(){//控制器controller刷新关闭会丢失数据。        var url = "http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1&callback=JSON_CALLBACK"        return $http.jsonp(url,{cache:true});//可以从缓存里调用数据，减少请求的次数    }})app.run(function($rootScope, $ionicLoading) {  $rootScope.$on('loading:show', function() {//$on绑定loading的动态状态    $ionicLoading.show({template: '你好吗'})//show里面可以定制loading界面     /*show()方法的 options 参数是一个 JSON 对象,可以包含如下字段:        template - 模板字符串        templateUrl - 内联模板的 Url        scope - 要绑定的作用域对象        noBackdrop - 是否隐藏背景幕        hideOnStateChange - 当切换到新的视图时,是否隐藏载入指示器        delay - 显示载入指示器之前要延迟的时间,以毫秒为单位,默认为 0,即不延迟 duration - 载入指示器持续时间,以毫秒为单位。时间到后载入指示器自 动隐藏。默认        情况下, 载入指示器保持显示状态,知道显示的调用 hide()方法          })        */  })  $rootScope.$on('loading:hide', function() {    $ionicLoading.hide()  })})app.controller('firstController', function($http, $ionicLoading,$scope,service01) {   service01.getData().success(function(data){       console.log(data);       $scope.items = [];       for(var i=0; i<15; i++){            $scope.items.push(data.result[i].title);           //            $scope.items.push([data.result[i].title].join(""));       }         }).error(function(){       alert("false")   })})</script></body></html>
0 0