ui-grid入门教程（一）

最近看UI-bootstrap资料，发现一款非常优秀的AngularJS插件ui-grid。由于是英文资料，下面根据我的理解和看到的英文资料写一个小的教程。

介绍

首先ui-grid是AngularUI库中的一部分，主要功能实现数据表格。主要特点是纯AngularJS，没有使用jquery；在一万行以上的大大数据表格表现性能好；只需加载需要的插件。

• 可配置性：可定制模板；可通过CSS更改外观；Drop-in插件


• 标注功能：排序；过滤；用户交互；端对端测试


• 高级特性：虚拟化；列固定；分组；直接编辑；扩展行；国际化



大家可以去官网看看例子

第一步

（1）引入css文件和javascript文件


（2）解决ui-grid依赖问题


var app=angular.module('app',['uigrid'])

（3）把主css文件加入表格样式


.myGrid {
     width: 500px;
     height: 250px;
 }

（4）在$scope上添加文档数据


$scope.myData = [
      {
           "firstName": "Cox",
            "lastName": "Carney"...

（5）在指令中使用一个data的json数据传递数据