I am calling a wcf service using angular js, but it's not binding the data in my ui grid.Please help
Controller code-
/// <reference path= "C:\Users\User List Application\User List Application\Scripts\angular.min.js"/>
/// <reference path= "C:\Users\User List Application\User List Application\Scripts\ajax.min.js"/>
var angular = angular.module('uigridApp', ["ui.grid"]);
angular.service("UserListingService", function ($http) {
this.getdata = function () {
var response = $http.get("http://localhost:58816/Service1.svc/SelectEDocsUserDetails");
return response;
}
});
angular.controller('uigridCtrl', function ($scope, UserListingService) {
getAlldata();
function getAlldata() {
var response = UserListingService.getdata();
response.then(function (d) {
$scope.emp = d.data;
}, function () {
alert("Error in feaching the record");
});
};
$scope.users = [{ name: "pre", age: "12", location: "jammu" },
{ name: "riya", age: "12", location: "jammu" },
{ name: "inku", age: "12", location: "jammu" }
];
$scope.gridoptions = {
// data: 'users',
data: 'emp',
showColumnFooter: true,
enableColumnresize: true
};
});
-----------------------
Html code
<!DOCTYPE html>
<html ng-app="uigridApp">
<head>
<link href="../Stylesheet/Mainpage.css" rel="stylesheet" />
<link href="../Stylesheet/uigrid.css" rel="stylesheet" />
<script src="../Scripts/angular.min.js"></script>
<script src="../Scripts/uigrid.js"></script>
<script src="../Scripts/ajax.min.js"></script>
<script src="../Controller/Maincontroller.js"></script>
<title></title>
<meta charset="utf-8" />
</head>
<body>
<div ng-controller="uigridCtrl">
<h2>User Details</h2>
<input type="button" value="export" ng-click="exportdata()" />
<div ui-grid="gridoptions" class="myGrid">
</div>
</div>
</body>
</html>
--------------------------------------