ng-grid
Posted 飘然离去
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ng-grid相关的知识,希望对你有一定的参考价值。
请查看官网: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的主要内容,如果未能解决你的问题,请参考以下文章
angularJS中的ui-router和ng-grid模块