请查看官网: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. [python] python单元测试经验总结

    python写单元大多数都会用到unittest和mock,测试代码覆盖率都会用到coverage,最后再用nose把所有的东西都串起来,这样每次出版本,都能把整个项目的单元测试都运行一遍. Unit ...

  2. teamviewer and openconnect-gp (globalprotect) in ubuntu

    wget https://download.teamviewer.com/download/teamviewer_i386.deb sudo dpkg -i teamviewer_i386.deb a ...

  3. HTTP返回码中301与302的区别(转)

    add by zhj:  区别 1.使用效果不同 302跳转是暂时的跳转,搜索引擎会抓取新的内容而保留旧的网址.因为服务器返回302代码,搜索引擎认为新的网址只是暂时的. 301重定向是永久的重定向, ...

  4. centos 配置mysql

    1.在线安装 1.首先检测一下,mysql之前有没有被安装 命令:rpm -qa | grep mysql 2.删除mysql的命令: rpm -e --nodeps `rpm -qa | grep ...

  5. C++模拟Http/Https访问web站点

    一.概述 1.Http与Https的区别与联系 在OSI参考模型中Http与Https均属于应用层协议.Http即Hypertext Transfer Protocol,超文本传输协议:而Https为 ...

  6. JavaScript类库汇总

    日期处理Moment.js    http://momentjs.cn/  http://momentjs.com/ nodejslinq,jslinq    http://jslinq.codepl ...

  7. Incorrect datetime value

    今天在开发库上给一个表添加字段时候,发现居然报错: root@DB 06:14:42>ALTER TABLE `DB`.` user` ADD COLUMN `status_mode` TINY ...

  8. PAT 1031 Hello World for U[一般]

    1031 Hello World for U (20 分) Given any string of N (≥5) characters, you are asked to form the chara ...

  9. Linux /proc/pid目录下各文件含义

    /proc 是一个伪文件系统, 被用作内核数据结构的接口, 而不仅仅是解释说明/dev/kmem. /proc 里的大多数文件都是只读的, 但也可以通过写一些文件来改变内核变量. ( Linux 内核 ...

  10. linux服务器查看IO

    为了方便各位和自己今后遇到此类问题能尽快解决,我这里将查看linux服务器硬盘IO访问负荷的方法同大家一起分享: 首先 .用top命令查看 top - 16:15:05 up 6 days,  6:2 ...