zoukankan      html  css  js  c++  java
  • ionic--分模块

    1. app.js

    var app=angular.module("myApp",["ionic","myController","serviceController"]);
    app.config(function(){});

    2. controller.js

    angular.module("shopcontroller",[])
    .controller("listController",function(listservice,$scope){
        $scope.getData=function(){
            listservice.getData(function(list){
                $scope.data=list;
                // 广播
                $scope.$broadcast('scroll.infiniteScrollComplete');
            })
        };
        $scope.flag=function(){
           return listservice.hasData();
        }
    })
    .controller("listDatailController",function($stateParams,listservice,$scope,$sce){
       var id=$stateParams.id;
            listservice.getOneData(id,function(data){
                $scope.datail=data.result[0].content;
                $scope.datail=$sce.trustAsHtml($scope.datail);
            });
       
    });

    3. service.js

    1.回调函数拿数据

    angular.module("serivecontroller",[])
    .service("listservice",function($http){
        var list=[];
        var page=1;
        var flag=true;
        return{  
            getData:function(callback){
    
                if(flag){
                    var myUrl = "http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page="+page+"&callback=JSON_CALLBACK";
    
                    $http.jsonp(myUrl).success(function(data){
                        list=list.concat(data.result);
                        callback(list);
                        page++;
                        if(data.result.length<20){
                            flag=false;
                        }
    
                    }).error(function(){
                        alert("加载错误");
                    });
                }
            },
            hasData:function(){
                return flag;
            } ,
            getOneData:function(id,callback){
    
                var myUrl = "http://www.phonegap100.com/appapi.php?a=getPortalArticle&aid="+id+"&callback=JSON_CALLBACK";
                $http.jsonp(myUrl).success(function(data){
                    callback(data);
                }).error(function(){
                    alert("加载错误");
                });
            }           
        }
    });

    2.广播获取数据

    拿到请求数据也可以不用回调函数,用广播来实现

    service.js代码:

    requestData:function(){
        var myUrl = "http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page="+page+"&callback=JSON_CALLBACK";
        $http.jsonp(myUrl).success(function(data){
            list=list.concat(data.result);
    
    //广播 数据拿到以后告诉controller 去拿数据
    
    这里广播的名字(newsListUpdata)自己起,但是有唯一性
    
    广播的同时也可以传数据
            $rootScope.$broadcast('newsListUpdata',list);
            page++;
        })
    }

    controller.js代码

    /*接收到广播以后去拿数据,newsListUpdata与服务里广播的名字一致*/
    $scope.$on('newsListUpdata',function(eve,data){
    
    /*这里得到的数据不会乱码,不需要再用$sce去解析*/
        $scope.list=data;
        /*拿到数据就到广播上拉刷新*/
        $scope.$broadcast('scroll.infiniteScrollComplete');
    })
    /*触发loadMore就调请求数据函数,但是收到广播时才去调用获取数据函数*/
    $scope.loadMore=function(){
        newsService.requestData();
    }
  • 相关阅读:
    Android学习小Demo(20)关于Fragment的应用
    计算机常识--框架、编程语言篇
    用python做oj上的简单题(持续更新中.......)
    UIControl-IOS开发
    Android各种屏幕分辨率(VGA、HVGA、QVGA、WQVGA、WVGA、FWVGA) 具体解释
    包管理器Bower使用手冊之中的一个
    23web app实现上下左右滑动
    iOS IAP教程
    一步一步写算法(之 A*算法)
    执行游戏时出现0xc000007b错误的解决方法
  • 原文地址:https://www.cnblogs.com/SPHmomo/p/7535222.html
Copyright © 2011-2022 走看看