How to use ng-grid using Angular JS

Step-1:

• Create new JavaScript file called "Myangualr.js". Add below code
• Create angular Module:
• angular.module("myAppModule", ['ngGrid',])
• Create angular Controller for the above module:
• var myAngualrApp = angular.module("myAppModule", ['ngGrid',])
• myAngualrApp.controller("myController", 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' }; }})

Step-2:

• Create html file and add the below code:
• <div ng-app="myAppModule">
•             <div ng-controller="myController">                
•                <div class="gridStyle" ng-grid="gridOptions"></div>
•             </div>
•         </div>
• Add the below css class for grid alignments:
• <style>
•     .gridStyle {
•         border: 1px solid rgb(212,212,212);
•         width: 400px;
•         height: 300px;
•     }
• </style>
• Run the soultion and out put will display in the browser...

OutPut: