angular1框架前台笔记

1.添加一个表格

        //主页面表格信息
        var initDataTable = function () {
            $scope.dataTable = $ngDataTables.init({
                src: "#dataTable",
                scope: $scope,
                selectable: true,
                searchable: true,
                pagingType: "full",
                simplepaging: true,
                language: {
                    "info": "",
                    "paginate": {
                        "previous": "<",
                        "next": ">",
                        "last": null,
                        "first": null,
                        "page": null,
                        "pageOf": null
                    }
                },
                ordering: false,
                columns: [
                    {
                        title: '客户/门店', data: 'CustomerName',
                        render: function (data, type, full, meta) {
                            var info = "";
                            info = info + full.CustomerName + "<br/>";
                            info = info + full.CustStoreName;
                            return info;
                        },
                        filters: {
                            items: [{
                                title: "客户",
                                field: "CustomerName",
                                op: "cn"
                            },
                            {
                                title: "门店",
                                field: "CustStoreName",
                                op: "cn"
                            }]
                        }
                    },
                    {
                        title: '姓名/手机', data: 'UserName',
                        render: function (data, type, full, meta) {
                            var info = "";
                            info = info + full.UserName + "<br/>";
                            info = info + full.UserTel;
                            return info;
                        },
                        filters: {
                            items: [{
                                title: "姓名",
                                field: "UserName",
                                op: "cn"
                            },
                            {
                                title: "手机",
                                field: "UserTel",
                                op: "cn"
                            }]
                        }
                    },
                    { title: "延保卡号", data: "CardNo" },
                    {
                        title: "延保卡年限", data: "CardYears",
                        render: function (data, type, full, meta) {
                            var info = "";
                            info = info + full.CardYears + "<br/>";
                            return info;
                        },
                        filters: {
                            items: [{
                                title: "延保卡年限",
                                field: "CardYears",
                                op: "bt"
                            }]
                        }
                    },
                    {
                        title: '车牌号/车型', data: 'CarBrand',
                        render: function (data, type, full, meta) {
                            var info = "";
                            info = info + full.CarBrand + "<br/>";
                            info = info + full.CarModel;
                            return info;
                        },
                        filters: {
                            items: [{
                                title: "车牌号",
                                field: "CarBrand",
                                op: "cn"
                            },
                            {
                                title: "车型",
                                field: "CarModel",
                                op: "cn"
                            }]
                        }
                    },
                    { title: "VIN码", data: "VinNumber" },
                    {
                        title: '行车证注册时间', data: 'RegisterTime', dataType: 'date',
                        render: function (data, type, full, meta) {
                            var info = "";
                            info = info + $filter('date')(full.RegisterTime, 'yyyy-MM-dd') + "<br/>";
                            return info;
                        },
                        filters: {
                            items: [{
                                title: "行车证注册时间",
                                field: "RegisterTime",
                                op: "bt"
                            }]
                        }
                    },                 
                    {
                        title: '提交日期', data: 'SubmitTime', dataType: 'date',
                        render: function (data, type, full, meta) {
                            var info = "";
                            info = info + $filter('date')(full.SubmitTime, 'yyyy-MM-dd') + "<br/>";
                            return info;
                        },
                        filters: {
                            items: [{
                                title: "提交日期",
                                field: "SubmitTime",
                                op: "bt"
                            }]
                        }
                    },
     
                ],
                getData: function (paging, success) {
                    //var model = {
                    //    paging: paging,
                    //    qxentity: $rootScope.UserLook
                    //}
                    $apiExtendWarranty.GetWarrantyList(paging, success);

                },
                search: {
                     150,
                    actionTemplate: "#actions"
                }

            });

        };
        initDataTable();

src: "#dataTable",控制HTML中表格的id

对应的HTML

<div class="black_table_responsive scroll_just margin-bottom-15">
            <table class="table table-striped table-bordered table-hover" id="dataTable">
                <thead>
                </thead>
                <tbody></tbody>
            </table>
            <script id="actions" type="text/template">
                <div class="btn-group btn-group-xs actions">
                    <button class="btn spec-lastbtn" data-action="edit">编辑</button>
                </div>
            </script>
        </div>

其中data-action="edit"操作表格中的动作按钮；

2.刷新表格

$scope.dataTable.refresh(true);

3.路径跳转

    //编辑
    $scope.edit = function (row) {
        var entity = $scope.dataTable.data[row];
        $location.path('/Insurance/Add/' + entity.CarId);
    

 4.获取表格中的单行数据

        //编辑
        $scope.edit = function (row) {
            var entity = $scope.dataTable.data[row];
            $location.path('/WeChat/Edit/' + entity.Id);
        }

5.时间格式化

$filter('date')(full.RegisterTime, 'yyyy-MM-dd')