Angular controller调用services

1、定义 factory.js 文件

var appFactorys = angular.module('starter.factorys',[])
appFactorys.factory('GoodsFactory',function () {
    var goodsList = [
        { "id": 1,"title": "手机","icon": "icon ion-android-phone-portrait calm","href": "#/homes/index" },{ "id": 2,"title": "笔记本","icon": "icon ion-android-laptop energized",{ "id": 3,"title": "电脑","icon": "icon ion-monitor assertive",{ "id": 4,"title": "数码产品","icon": "icon ion-android-camera balanced",{ "id": 5,"title": "摩托车","icon": "icon ion-stats-bars balanced",{ "id": 6,"title": "自行车","icon": "icon ion-android-bicycle calm",{ "id": 7,"title": "电动车","icon": "icon ion-stats-bars assertive",{ "id": 8,"title": "三轮车","icon": "icon ion-stats-bars positive",{ "id": 9,"title": "家具",{ "id": 10,"title": "家用电器","icon": "icon ion-stats-bars calm",// { "id": 11,"title": "服饰箱包","icon": "icon ion-tshirt assertive",{ "id": 11,"icon": "icon ion-bag assertive",{ "id": 12,"title": "母婴儿童",];
    return {
        all: function () {
            return goodsList;
        },};
});

2、定义 services.js 文件,并且调用factory函数

var appServices = angular.module('starter.services',[])
appServices.service('GoodsService',function (GoodsFactory) {
    return {
        query: function () {
            return GoodsFactory.all();
        },};
});

3、在 app.js 文件引用 factory.js、services.js 文件

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

4、在controller中调用services

appControllers.controller("SecondHandGoodsCtrl",function ($scope,$state,$ionicModal,$cordovaToast,GoodsService) {
    /* 调用services.js数据 */
    $scope.categoryList = GoodsService.query();
})
5、html页面调用
<div class="row row-wrap">
    <ion-item class="col col-25" ng-repeat="item in categoryList">
        <ul>
            <li>
                <a href="#/housekeeping">
                    <dt><i class="{{item.icon}}"></i></dt>
                    <dd>{{item.title}}</dd>
                </a>
            </li>
        </ul>
    </ion-item>
</div>

相关文章

AngularJS 是一个JavaScript 框架。它可通过 注:建议把脚本放在 元素的底部。这会提高网页加载速度,因...
angluarjs中页面初始化的时候会出现语法{{}}在页面中问题,也即是页面闪烁问题。出现这个的原因是:由于...
AngularJS 通过被称为指令的新属性来扩展 HTML。AngularJS 指令AngularJS 指令是扩展的 HTML 属性,带有...
AngularJS 使用表达式把数据绑定到 HTML。AngularJS 表达式AngularJS 表达式写在双大括号内:{{ expres...
ng-repeat 指令可以完美的显示表格。在表格中显示数据 {{ x.Name }} {{ x.Country }} 使用 CSS 样式为了...
$http是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。读取 JSON 文件下是存储在web服务器上...