Angular controller调用factory

前端之家收集整理的这篇文章主要介绍了Angular controller调用factory前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

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: '急售东二环 小区配套齐全 精装修',img: 'img/max.png' },{ id: 2,title: '急售南二环 小区配套齐全 精装修',price: '87.0',img: 'img/adam.jpg' },{ id: 3,title: '急售西二环 小区配套齐全 精装修',price: '86.0',img: 'img/perry.png' },{ id: 4,price: '85.0',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,//     { id: 1,//     { id: 2,//     { id: 3,//     { id: 4,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}}" 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>

猜你在找的Angularjs相关文章