Hi skp,
Check this example. Now please take its reference and correct your code.
Here i am using WebMethod to call aspx page method. You need to call the Web API to return Json string from DataSet using Newtonsoft Json Library.
Database
For this example I have used of Northwind database that you can download using the link given below.
Download Northwind Database
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module('MyApp', []);
app.controller('MyController', function ($scope, $http, $window) {
$http.post("Default.aspx/GetDataSet", { headers: { 'Content-Type': 'application/json'} })
.then(function (response) {
$scope.Employees = JSON.parse(response.data.d).Table;
$scope.Customers = JSON.parse(response.data.d).Table1;
}, function error(response) {
alert(response.responseText);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div ng-app="MyApp" ng-controller="MyController">
<h3>Employees</h3>
<table id="tblEmployees">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>City</th>
<th>Country</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="employee in Employees">
<td>{{ employee.Id }}</td>
<td>{{ employee.Name }}</td>
<td>{{ employee.City }}</td>
<td>{{ employee.Country }}</td>
</tr>
</tbody>
</table>
<hr />
<h3>Customers</h3>
<table id="tblCustomers">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>City</th>
<th>Country</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="customer in Customers">
<td>{{ customer.Id }}</td>
<td>{{ customer.Name }}</td>
<td>{{ customer.City }}</td>
<td>{{ customer.Country }}</td>
</tr>
</tbody>
</table>
</div>
</form>
</body>
</html>
Namespaces
C#
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Web.Services;
using Newtonsoft.Json;
VB.Net
Imports System.Configuration
Imports System.Data
Imports System.Data.SqlClient
Imports System.Web.Services
Imports Newtonsoft.Json
Code
C#
[WebMethod]
public static string GetDataSet()
{
DataSet ds = new DataSet();
string sql = "SELECT TOP 5 EmployeeID Id,FirstName + ' ' + LastName Name,City,Country FROM Employees;";
sql += "SELECT TOP 5 CustomerID Id,ContactName Name,City,Country FROM Customers;";
using (SqlConnection con = new SqlConnection())
{
con.ConnectionString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlCommand cmd = new SqlCommand(sql))
{
cmd.Connection = con;
using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
{
sda.Fill(ds);
}
}
return JsonConvert.SerializeObject(ds, Formatting.Indented);
}
}
VB.Net
<WebMethod()>
Public Shared Function GetDataSet() As String
Dim ds As DataSet = New DataSet()
Dim sql As String = "SELECT TOP 5 EmployeeID Id,FirstName + ' ' + LastName Name,City,Country FROM Employees;"
sql += "SELECT TOP 5 CustomerID Id,ContactName Name,City,Country FROM Customers;"
Using con As SqlConnection = New SqlConnection()
con.ConnectionString = ConfigurationManager.ConnectionStrings("constr").ConnectionString
Using cmd As SqlCommand = New SqlCommand(sql)
cmd.Connection = con
Using sda As SqlDataAdapter = New SqlDataAdapter(cmd)
sda.Fill(ds)
End Using
End Using
Return JsonConvert.SerializeObject(ds, Formatting.Indented)
End Using
End Function
Screenshot