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();
}

ionic--分模块的更多相关文章

  1. 分模块创建maven项目(一)

    maven是一个项目构建和管理的工具. 我们可以通过maven仓库可以实现管理构建(主要是JAR还包括:WAR,ZIP,POM等等). 我们可以通过maven插件可以实现编译源代.产生Javadoc文 ...

  2. Maven02——回顾、整合ssh框架、分模块开发、私服

    1 回顾 1.1 Maven的好处 节省空间 对jar包做了统一管理 依赖管理 一键构建 可跨平台 应用在大型项目可提高开发效率 1.2 Maven安装部署配置 1.3 Maven的仓库 本地仓库 远 ...

  3. 若依项目分模块集成uflo2

    关于若依分模块创建项目可参考:https://www.cnblogs.com/conswin/p/9766186.html 了解uflo2,uflo2是一套由BSTEK自主研发的基于Java的工作流引 ...

  4. java分模块项目在idea中使用maven打包失败(ps:maven常用到的命令)

    一.分模块项目打包失败 情况:项目是分模块创建的,一些公共的方法是单独的一个模块common,其他模块依赖于此模块,poom依赖已经添加了,项目可以正常运行,但使用maven打包时出现了问题:找不到依 ...

  5. 配置动态加载模块和js分模块打包,生产环境和开发环境公共常量配置

    1. 话不多少 先上代码:  route.js  // 引用模板 分模块编译 const main = r => require.ensure([], () => r(require('. ...

  6. SSH框架分模块开发

    ------------------siwuxie095 SSH 框架分模块开发 1.在 Spring 核心配置文件中配置多个内容,容易造成 配置混乱,不利于维护 「分模块开发主要针对 Spring ...

  7. Spring_day04--HibernateTemplate介绍_整合其他方式_Spring分模块开发

    HibernateTemplate介绍 1 HibernateTemplate对hibernate框架进行封装, 直接调用HibernateTemplate里面的方法实现功能 2 HibernateT ...

  8. Struts2_day01--Struts2的核心配置文件_常量配置_分模块开发_Action编写方式

    Struts2的核心配置文件 1 名称和位置固定的 2 在配置文件中主要三个标签 package.action.result,标签里面的属性 标签package 1 类似于代码包,区别不同的actio ...

  9. Struts2分模块开发

    -------------------siwuxie095 Struts2 分模块开发 在实际开发中,如果一个项目是团队开发的,也就是很多人开发的, 每个人都需要去修改 struts.xml,因为 s ...

  10. SpringBoot23 分模块开发

    1 开发环境说明 JDK:1.8 MAVEN:3.5 IDEA:2017.2.5 SpringBoot:2.0.3.RELEASE 2 创建SpringBoot项目 2.1 项目信息 2.2 添加项目 ...

随机推荐

  1. mysql随机取出若干条记录的实用方法

    1.常见的方法 ; 这种方法可以随机取得数据,但是如果表比较大,数据量很多的时候会很耗时. 2.优化后的方式 ) as t ); 分析,首先根据条件筛选出要选的数据,然后随机排序取出要的条数的id , ...

  2. P2051 中国象棋

    P2051 中国象棋 题目描述 这次小可可想解决的难题和中国象棋有关,在一个N行M列的棋盘上,让你放若干个炮(可以是0个),使得没有一个炮可以攻击到另一个炮,请问有多少种放置方法.大家肯定很清楚,在中 ...

  3. c# timer使用

    C#里现在有3个Timer类: System.Windows.Forms.Timer System.Threading.Timer System.Timers.Timer 这三个Timer我想大家对S ...

  4. Android 4.4 KitKat终于支持录屏(Screen Recording)了!

    本文介绍了Android 4.4 KitKat系统新增加的录屏功能以及录屏方法,和限制因素.如果App由于版权方面的原因,不想被记录屏幕录像的话,APP只需要在相应的SurfaceView请求“Sur ...

  5. [DPF] DPF 常见的问题

    问题一: SQL6031N  Error in the db2nodes.cfg file at line number "5".  Reason code "12&qu ...

  6. android studio ndk 开发入门

    ndk 开发没什么神秘的ndk 说白了就是一个交叉编译的工具链,用它来生成各个CPU架构下的静态或动态链接库,linux 下就是 .a 和 .so 文件.原理就是 java 通过 JNI 和 C.C+ ...

  7. PHP将字符串写入txt文件

    function writelog($str) { $open=fopen("e:\log.txt","a" ); fwrite($open,$str); fc ...

  8. POJ 3481 Double Queue(set实现)

    Double Queue The new founded Balkan Investment Group Bank (BIG-Bank) opened a new office in Buchares ...

  9. Ruby(1):入门

    安装: 一般来说linux会自动装ruby,可以通过: ruby -v 来查看ruby版本 直接使用ruby命令的话,是用来执行ruby文件的.如果要打开交互式ruby解释器.只需要在控制台输入:ir ...

  10. 【angular5项目积累总结】http请求服务封装

    http.provider.ts import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/co ...