ng-grid实现表格

<div class="gridStyle" ng-grid="gridOptions">
</div>

在所属控制器中：

$scope.gridOptions = {
        data: 'books',
        rowTemplate: '<div style="height: 100%"><div ng-style="{ \'cursor\': row.cursor }" ng-repeat="col in renderedColumns" ng-class="col.colIndex()" class="ngCell ">' +
            '<div class="ngVerticalBar" ng-style="{height: rowHeight}" ng-class="{ ngVerticalBarVisible: !$last }"> </div>' +
            '<div ng-cell></div>' +
            '</div></div>',
        multiSelect: false,//是否支持多选
        enableCellSelection: true,//单元格是否可被选中
        enableRowSelection: false,//行是否可被选中
        enableCellEdit: true,//单元格可否被编辑
        enablePinning: true,
        columnDefs: [{//列的定义
            field: 'index',
            displayName: '序号',
            width: 60,
            pinnable: false,
            sortable: false
        }, {
            field: 'name',
            displayName: '书名',
            enableCellEdit: true
        }, {
            field: 'author',
            displayName: '作者',
            enableCellEdit: true,
            width: 220
        }, {
            field: 'pubTime',
            displayName: '出版日期',
            enableCellEdit: true,
            width: 120
        }, {
            field: 'price',
            displayName: '定价',
            enableCellEdit: true,
            width: 120,
            cellFilter: 'currency:"￥"'//对于钱可以定义filter格式化
        }, {
            field: 'bookId',
            displayName: '操作',
            enableCellEdit: false,
            sortable: false,
            pinnable: false,
            cellTemplate: '<div><a ui-sref="bookdetail({bookId:row.getProperty(col.field)})" id="{{row.getProperty(col.field)}}">详情</a></div>'
        }],
        enablePaging: true,
        showFooter: true,
        totalServerItems: 'totalServerItems',
        pagingOptions: $scope.pagingOptions,
        filterOptions: $scope.filterOptions
    };

rowTemplate：每一行的模版

enablePinning：如下图圈出

cellTemplate：单元格内也可以自定义模版，官方文档中给出了规定的模版。

关于表单的校验：本地校验和远程校验

http://damoqiongqiu.iteye.com/blog/1920191

http://damoqiongqiu.iteye.com/blog/1920993