ui-grid(1)--基础

ui-gird 是AngularJS的插件，用于处理数据表格，对于1000条以上的数据处理起来也能很快。

需要引用的文件：

<link href="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.css" rel="stylesheet">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script src="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.js"></script>

如果需要导出功能需要引用以下文件(网上可下载)

<script src="../js/pdfmake.js"></script>
<script src="../js/vfs_fonts.js"></script>
<script src="../js/csv.js"></script>

Example

1、html页面

    <div ng-app="myApp" ng-controller="listController">
        <div ui-grid="gridOptions" style="width: 100%;height: auto; text-align: center;"></div>
    </div>

2、js页面

var app = angular.module('myApp', ['ui.grid']);
app.controller('listController', function ($scope, $rootScope, $http, i18nService) {
// 国际化 转成中文
    i18nService.setCurrentLang("zh-cn");
    //------------ui gird-------------
    $scope.gridOptions = {
        columnDefs: [
            {
                name: 'filmId',
                displayName: '电影ID'
            },
            {
                name: "title",
                displayName: '电影名称'
            }
        ]
        };
        $scope.gridOptions.data = [
            {filmId:1,title:'金刚'},
            {filmId:2,title:'闪电侠'}
        ];