今天完成的事情：

1.首页banner的轮播编写。

2.学习了下mock.js如何造假数据。

<!-- 兼容angular (mock.js默认不兼容angular，需额外引用兼容包)-->

<script src="./src/mock.angular.js"></script>

<!-- 模拟数据 -->

<script src="./mockData.js"></script>

<!-- 使用 -->

<script>

(function() {

    (function() {

        var app;

        app = angular.module('app', []);

        //使用mockjax方法覆盖Ajax请求

        Mock.mockjax(app);

        return app.controller('appCtrl', function($scope, $http) {

            var box;

            box = $scope.box = [];

            $scope.get = function() {

                $http({

                    url: 'http://www.baidu.com',

                    method: 'POST',

                    params: {a: 1},

                    data  : {b:1}

                }).success(function(data) {

                return box.push(data);

            });

            $http({

                url: 'http://baidu.com'

                }).success(function(data) {

                console.log(data);

                });

            };

        return $scope.get();

        });

    })();

}).call(this);

</script>

假数据的文件：

Mock.mock('http://www.baidu.com', {

    'name': '@name()',

    'age|1-100': 100,

    'color': '@color'

});

这里的数据模板中的每个属性由 3 部分构成：属性名、生成规则、属性值：

// 属性名   name

// 生成规则 rule

// 属性值   value

'name|rule': value

注意：

属性名 和 生成规则 之间用 | 分隔。

生成规则 是可选的。

生成规则 有 7 种格式：

'name|min-max': value

'name|count': value

'name|min-max.dmin-dmax': value

'name|min-max.dcount': value

'name|count.dmin-dmax': value

'name|count.dcount': value

'name|+step': value

生成规则 的 含义 需要依赖 属性值 才能确定。

属性值 中可以含有 @占位符。

属性值 还指定了最终值的初始值和类型。

生成规则和示例：

1. 属性值是字符串 String

'name|min-max': 'value' 通过重复 'value' 生成一个字符串，重复次数大于等于 min，小于等于 max。

'name|count': 'value' 通过重复 'value' 生成一个字符串，重复次数等于 count。

2. 属性值是数字 Number

'name|+1': 100 属性值自动加 1，初始值为 100

'name|1-100': 100 生成一个大于等于 1、小于等于 100 的整数，属性值 100 只用来确定类型。

'name|1-100.1-10': 100 生成一个浮点数，整数部分大于等于 1、小于等于 100，小数部分保留 1 到 10 位。

    {

    'number1|1-100.1-10': 1,

    'number2|123.1-10': 1,

    'number3|123.3': 1,

    'number4|123.10': 1.123

    }

    // =>

    {

    "number1": 12.92,

    "number2": 123.51,

    "number3": 123.777,

    "number4": 123.1231091814

    }

3. 属性值是布尔型 Boolean

'name|1': value 随机生成一个布尔值，值为 true 的概率是 1/2，值为 false 的概率是 1/2。

'name|min-max': value 随机生成一个布尔值，值为 value 的概率是 min / (min + max)，值为 !value 的概率是 max / (min + max)。

4. 属性值是对象 Object

'name|min-max': {} 从属性值 {} 中随机选取 min 到 max 个属性。

'name|count': {} 从属性值 {} 中随机选取 count 个属性。

5. 属性值是数组 Array

'name|1': [{}, {} ...] 从属性值 [{}, {} ...] 中随机选取 1 个元素，作为最终值。

'name|min-max': [{}, {} ...] 通过重复属性值 [{}, {} ...] 生成一个新数组，重复次数大于等于 min，小于等于 max。

'name|count': [{}, {} ...] 通过重复属性值 [{}, {} ...] 生成一个新数组，重复次数为 count。

6. 属性值是数组 Function

'name': function(){} 执行函数 function(){}，取其返回值作为最终的属性值，上下文为 'name' 所在的对象。

没错，就是这么简单。

明天计划的事情：

继续首页模块的编写

遇到的问题：

竖向轮播还没学会

收获：

如何使用mock.js