Описание тега ng-grid

Описание тега Вопросы с тегом

NoneNg -grid is a datagrid written in AngularJS and jQuery by the AngularUI Team. It is a high-performance datagrid which uses virtualization for rendering rows and performs well with large data sets.

ng-grid is a datagrid written in angularjs and jquery by the AngularUI Team. It is a high-performant datagrid using virtualization for rendering rows and really shines when you have lots of rows.

The 3.0 branch of ng-grid will be renamed in angular-ui-grid and will depend on AngularJS only.

Similar libraries:

koGrid
slickGrid (unmaintained since March 5th, 2014)

Basic Setup:

index.html

<html>
<head>
    <link rel="stylesheet" type="text/css" href="../ng-grid.css" /> 
    <script type="text/javascript" src="../lib/angular.js"></script>
    <script type="text/javascript" src="../lib/jquery.min.js"></script>
    <script type="text/javascript" src="../ng-grid.js"></script>
    <script type="text/javascript" src="main.js"></script>
</head>
<body ng-app="MyGridApp" ng-controller="bodyController">
    <div ng-grid="gridOptions">
    </div>
</body>
</html>

main.js:

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

app.controller('bodyController', ['$scope', 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' };// $scope.myData is also acceptable but will not update properly. OK to use the object if you don't care about updating the data in the grid.
}]);