详解AngularJS controller调用factory


Posted in Javascript onMay 19, 2017

1、定义 factory.js 文件

var appFactorys = angular.module('starter.factorys', []) 
appFactorys.factory('HouseFactory', function () { 
  var houseList = [ 
    { id: 0, title: '急售北二环 小区配套齐全 精装修', price: '88.0', describe: '2室1厅 120平米', img: 'img/ben.png' }, 
    { id: 1, title: '急售东二环 小区配套齐全 精装修', price: '88.0', describe: '2室1厅 120平米', img: 'img/max.png' }, 
    { id: 2, title: '急售南二环 小区配套齐全 精装修', price: '87.0', describe: '2室1厅 120平米', img: 'img/adam.jpg' }, 
    { id: 3, title: '急售西二环 小区配套齐全 精装修', price: '86.0', describe: '2室1厅 120平米', img: 'img/perry.png' }, 
    { id: 4, title: '急售北二环 小区配套齐全 精装修', price: '85.0', describe: '2室1厅 120平米', img: 'img/mike.png' } 
  ]; 
  return { 
      all: function () { 
        return houseList; 
      }, 
    }; 
});

2、在 app.js 文件引用 factory.js 文件

angular.module('starter', ['ionic', 'ngCordova', 'starter.directives','starter.factorys','starter.services', 'starter.customControllers']) 

3、在controller中调用factory

appControllers.controller('HouseCtrl', function ($scope, $timeout, $ionicModal, $ionicActionSheet, $http, $cordovaToast, $ionicLoading, HouseFactory) { 
  // $scope.houseList = [ 
  //   { id: 0, title: '急售北二环 小区配套齐全 精装修', price: '88.0', describe: '2室1厅 120平米', img: 'img/ben.png' }, 
  //   { id: 1, title: '急售东二环 小区配套齐全 精装修', price: '88.0', describe: '2室1厅 120平米', img: 'img/max.png' }, 
  //   { id: 2, title: '急售南二环 小区配套齐全 精装修', price: '87.0', describe: '2室1厅 120平米', img: 'img/adam.jpg' }, 
  //   { id: 3, title: '急售西二环 小区配套齐全 精装修', price: '86.0', describe: '2室1厅 120平米', img: 'img/perry.png' }, 
  //   { id: 4, title: '急售北二环 小区配套齐全 精装修', price: '85.0', describe: '2室1厅 120平米', img: 'img/mike.png' } 
  // ]; 
 
  /* 调用Factory.js数据 */ 
  $scope.houseList = HouseFactory.all(); 
 
})

4、html页面调用

<ion-list> 
  <ion-item class="item item-thumbnail-left" ng-repeat="item in houseList" href="#/housedetail/{{item.id}}" rel="external nofollow" style="padding--bottom:2px"> 
    <img ng-src="{{item.img}}"> 
    <h2>{{item.title}}</h2> 
    <dd class="assertive cus-price">{{item.price}}万元</dd> 
    <dd class="u-f-h4">{{item.describe}}</dd> 
  </ion-item> 
</ion-list>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
任意位置显示html菜单
Feb 01 Javascript
jQuery1.3.2 升级到jQuery1.4.4需要修改的地方
Jan 06 Javascript
简短几句 通俗解释javascript的闭包
Jan 17 Javascript
javascript 保存文件到本地实现方法
Nov 29 Javascript
JS动态添加option和删除option(附实例代码)
Apr 01 Javascript
JQuery for与each性能比较分析
May 14 Javascript
JS控制图片等比例缩放的示例代码
Dec 24 Javascript
js判断手机访问或者PC的几个例子(常用于手机跳转)
Dec 15 Javascript
JS简单获取客户端IP地址的方法【调用搜狐接口】
Sep 05 Javascript
Node.js如何使用Diffie-Hellman密钥交换算法详解
Sep 05 Javascript
JavaScript格式化json和xml的方法示例
Jan 22 Javascript
基于JQuery实现页面定时弹出广告
May 08 jQuery
layer弹窗插件操作方法详解
May 19 #Javascript
layui选项卡效果实现代码
May 19 #Javascript
bootstrap table单元格新增行并编辑
May 19 #Javascript
layui弹出层效果实现代码
May 19 #Javascript
layui分页效果实现代码
May 19 #Javascript
layui前段框架日期控件使用方法详解
May 19 #Javascript
详解Node.js开发中的express-session
May 19 #Javascript
You might like
Ping服务的php实现方法,让网站快速被收录
2012/02/04 PHP
php基于base64解码图片与加密图片还原实例
2014/11/03 PHP
PHP操作MySQL的mysql_fetch_* 函数的常见用法教程
2015/12/25 PHP
thinkphp多层MVC用法分析
2015/12/30 PHP
关于PHP中字符串与多进制转换函数的实例代码
2016/11/03 PHP
PHPMailer发送邮件
2016/12/28 PHP
laravel框架中表单请求类型和CSRF防护实例分析
2019/11/23 PHP
用js实现预览待上传的本地图片
2007/03/15 Javascript
读jQuery之十四 (触发事件核心方法)
2011/08/23 Javascript
jQuery性能优化28条建议你值得借鉴
2013/02/16 Javascript
Javascript表格翻页效果实现思路及代码
2013/08/23 Javascript
jQuery实现根据类型自动显示和隐藏表单
2015/03/18 Javascript
利用JS实现文字的聚合动画效果
2017/01/22 Javascript
jQuery实现滚动到底部时自动加载更多的方法示例
2018/02/18 jQuery
JS 中可以提升幸福度的小技巧(可以识别更多另类写法)
2018/07/28 Javascript
基于vue-cli 路由 实现类似tab切换效果(vue 2.0)
2019/05/08 Javascript
通过实例了解js函数中参数的传递
2019/06/15 Javascript
判断JavaScript中的两个变量是否相等的操作符
2019/12/21 Javascript
小程序自定义模板实现吸顶功能
2020/01/08 Javascript
详解elementUI中input框无法输入的问题
2020/04/27 Javascript
利用Python和OpenCV库将URL转换为OpenCV格式的方法
2015/03/27 Python
Python yield 使用浅析
2015/05/28 Python
Python统计单词出现的次数
2018/04/04 Python
python lambda表达式(匿名函数)写法解析
2019/09/16 Python
Python使用pymysql模块操作mysql增删改查实例分析
2019/12/19 Python
python base64库给用户名或密码加密的流程
2020/01/02 Python
python用分数表示矩阵的方法实例
2021/01/11 Python
html5利用canvas实现颜色容差抠图功能
2019/12/23 HTML / CSS
Tom Dixon官网:英国照明及家具设计和制造公司
2019/03/01 全球购物
巴西购物网站:Submarino
2020/01/19 全球购物
介绍一下SQL中union,intersect和minus
2012/04/05 面试题
银行介绍信范文
2014/01/10 职场文书
小学生作文批改评语
2014/12/25 职场文书
补充协议书
2015/01/28 职场文书
入党积极分子党小组意见
2015/06/02 职场文书
2016寒假假期总结
2015/10/10 职场文书