请查看官网：http://angular-ui.github.io/ui-grid/

简单的使用: 总的来说我们

1.需要引入ng-grid-1.3.2.js

2.在html页面需要加入  class="gridStyle" ng-grid="gridOptions"

//  html

<html ng-app="myApp">

    <head lang="en">

        <meta charset="utf-8">

        <title>Getting Started With ngGrid Example</title>

        <link rel="stylesheet" type="text/css" href="ng-grid.css" />

        <link rel="stylesheet" type="text/css" href="style.css" />

        <script type="text/javascript" src="jquery-1.8.2.js"></script>

        <script type="text/javascript" src="angular.js"></script>

        <script type="text/javascript" src="ng-grid-1.3.2.js"></script>

        <script type="text/javascript" src="main.js"></script>

    </head>

    <body ng-controller="MyCtrl">

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

    </body>

</html>
.gridStyle {

    border: 1px solid rgb(212,212,212);

    width: 400px;

    height: 300px;

}
var app = angular.module('myApp', ['ngGrid']);

app.controller('MyCtrl', function($scope) {

    $scope.myData = [{name: "Moroni", age: 50},

                     {name: "Tiancum", age: 43},

                     {name: "Jacob", age: 27},

                     {name: "Nephi", age: 29},

                     {name: "Enos", age: 34}];

    $scope.gridOptions = {

        data: 'myData',

        columnDefs: [{field:'name', displayName:'Name'}, {field:'age', displayName:'Age'}]

    };

});

ng-grid的更多相关文章

  1. ExtJS自制表格Grid分页条

    试过Grid自带的load和分页功能,没有成功,干脆就自己写了...... 主要是查询条件比较复杂...... 希望哪位大神能有更好的意见. Ext.define('MyApp.ux.Paginati ...

  2. Andrew Ng机器学习入门——线性回归

    本人从2017年起,开始涉猎机器学习.作为入门,首先学习的是斯坦福大学Andrew Ng(吴恩达)教授的Coursera课程 2 单变量线性回归 线性回归属于监督学习(Supervise Learni ...

  3. 【原】Coursera—Andrew Ng机器学习—编程作业 Programming Exercise 4—反向传播神经网络

    课程笔记 Coursera—Andrew Ng机器学习—课程笔记 Lecture 9_Neural Networks learning 作业说明 Exercise 4,Week 5,实现反向传播 ba ...

  4. [C2P2] Andrew Ng - Machine Learning

    ##Linear Regression with One Variable Linear regression predicts a real-valued output based on an in ...

  5. ExtJS 4.2 Grid组件的单元格合并

    ExtJS 4.2 Grid组件本身并没有提供单元格合并功能,需要自己实现这个功能. 目录 1. 原理 2. 多列合并 3. 代码与在线演示 1. 原理 1.1 HTML代码分析 首先创建一个Grid ...

  6. WPF中Grid实现网格，表格样式通用类

    /// <summary> /// 给Grid添加边框线 /// </summary> /// <param name="grid"></ ...

  7. 在 Windows Phone 中，为 Grid 添加 Tilt 效果

    在 Windows Phone 中,Tilt 效果是比较经典的效果,我们可以很简单的为按钮等控件添加这样的效果(使用 Windows Phone Toolkit 的Tilt 效果),但是,如果我们想要 ...

  8. wpf 列表、菜单 收起与展开，通过Grid DoubleAnimation或者Expander实现

    菜单收缩有很多种方法具体如何实现还是看个人想法: 第一种通过后台控制收起与展开: 效果图: 代码 : <Grid> <Grid.ColumnDefinitions> <C ...

  9. Sencha ExtJS 6 Widget Grid 入门

    最近由于业务需要,研究了一下Sencha ExtJS 6 ,虽然UI和性能上据相关资料说都有提升,但是用起来确实不太顺手,而且用Sencha cmd工具进行测试和发布,很多内部细节都是隐藏的,出了问题 ...

  10. WPF CheckBox样式 ScrollViewer样式 WrapPanel、StackPanel、Grid布局

    本节讲述布局,顺带加点样式给大家看看~单纯学布局,肯定是枯燥的~哈哈 那如上界面,该如何设计呢? 1.一些布局元素经常用到.Grid StackPanel Canvas WrapPanel等.如上这种 ...

随机推荐

  1. 神奇的随机数rand（）

    随机数在统计理论中占有很重要的地位,很多应用都需要用到他,系统自带的rand()函数产生的是伪随机数,所以该如何真正的随机数呢? 1.c语言中的时间函数 关于c语言我查到的两个比较好的博文是:http ...

  2. 【转载】国外程序员整理的Java资源大全

    以下转载自: 推荐!国外程序员整理的Java资源大全中文版    https://github.com/akullpp/awesome-java英文版 Java 几乎是许多程序员们的入门语言,并且也是 ...

  3. 从零打造在线网盘系统之Hibernate框架起步

    欢迎浏览Java工程师SSH教程从零打造在线网盘系统系列教程,本系列教程将会使用SSH(Struts2+Spring+Hibernate)打造一个在线网盘系统,本系列教程是从零开始,所以会详细以及着重 ...

  4. 【vue】---Object.defineProperty基本使用---【巷子】

    1.object.defineProperty 给一个对象定义一个新的属性或者在修改一个对象现有的属性,并返回这个对象 语法: Object.defineProperty(参数1,参数2,参数3) 参 ...

  5. 2.title

    1.母版页里写title,标题会:会显示母版页里的. 结果如下: 2.母版页和实现模板页同时都设置了title,会显示实现模板页里的title 运行结果页:

  6. 洛谷P3809 后缀排序【后缀数组】【模板】

    题目背景 这是一道模板题. 题目描述 读入一个长度为 nn 的由大小写英文字母或数字组成的字符串,请把这个字符串的所有非空后缀按字典序从小到大排序,然后按顺序输出后缀的第一个字符在原串中的位置.位置编 ...

  7. Ora-1157 ora-1110错误解决案例一枚

    1.数据库打开报错如下: SQL> alter database open; alter database open * ERROR at line 1: ORA-01157: cannot i ...

  8. avaScript 的基础学习(一)

    JavaScript概述 JavaScript由三部分组成: JavaScript的基础 JS的引入方式: JS的数据类型: 运算符: 流程控制: JavaScript的对象 BOM对象 DOM Ev ...

  9. 构建vue项目（vue 2.x）时的一些配置问题（持续更新）

    基于前文,使用vue-cli脚手架工具构建项目,并使用了webpack,那么我在项目中遇到的一些与配置相关的问题将在这里进行汇总. 1.代码检查问题 由于我们在构建项目时,使用了Eslint对我们的项 ...

  10. Jscript运行时错误：没有权限

    问题:我在页面A中放了一个iframe ,然后在iframe 的子页面中调用主页面中的JavaScript函数,结果报错Jscript运行时错误:没有权限 原因有2: 1. 是逻辑错误,比如先关闭了i ...