Hi rani,
Check this example. Now please take its reference and correct your code.
Database
for this example i have used table named tblFiles whose schema is defined as follows.
You can download the database table SQL by clicking the download link below.
Download SQL file
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module('MyApp', []);
app.controller("MyController", function ($scope, $http, $sce) {
$http.post("Default.aspx/GetFiles", { headers: { 'Content-Type': 'application/json'} })
.then(function (response) {
var files = eval(response.data.d);
for (var i = 0; i < files.length; i++) {
files[i].Data = $sce.trustAsResourceUrl('data:application/pdf;base64,' + files[i].Data);
}
$scope.Files = files;
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div ng-app="MyApp" ng-controller="MyController">
<table id="tblCustomers">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Data</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="file in Files">
<td>{{ file.Id }}</td>
<td>{{ file.Name }}</td>
<td><iframe ng-src="{{file.Data }}" height="150px" width="400px"></iframe></td>
</tr>
</tbody>
</table>
</div>
</form>
</body>
</html>
Namespaces
C#
using System.Data.SqlClient;
using System.Web.Script.Serialization;
using System.Web.Services;
VB.Net
Imports System.Data.SqlClient
Imports System.Web.Script.Serialization
Imports System.Web.Services
Code
C#
[WebMethod]
public static string GetFiles()
{
List<object> files = new List<object>();
string sql = "SELECT id,Name,ContentType,Data FROM tblFiles WHERE ContentType = 'application/pdf'";
using (SqlConnection conn = new SqlConnection())
{
conn.ConnectionString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlCommand cmd = new SqlCommand(sql))
{
cmd.Connection = conn;
conn.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
files.Add(new
{
Id = sdr["id"],
Name = sdr["Name"],
ContentType = sdr["ContentType"],
Data = Convert.ToBase64String((byte[])sdr["Data"])
});
}
}
conn.Close();
}
}
return new JavaScriptSerializer().Serialize(files);
}
VB.Net
<WebMethod()>
Public Shared Function GetFiles() As String
Dim files As List(Of Object) = New List(Of Object)()
Dim sql As String = "SELECT id,Name,ContentType,Data FROM tblFiles WHERE ContentType = 'application/pdf'"
Using conn As SqlConnection = New SqlConnection()
conn.ConnectionString = ConfigurationManager.ConnectionStrings("constr").ConnectionString
Using cmd As SqlCommand = New SqlCommand(sql)
cmd.Connection = conn
conn.Open()
Using sdr As SqlDataReader = cmd.ExecuteReader()
While sdr.Read()
files.Add(New With {
.Id = sdr("id"),
.Name = sdr("Name"),
.ContentType = sdr("ContentType"),
.Data = Convert.ToBase64String(CType(sdr("Data"), Byte()))
})
End While
End Using
conn.Close()
End Using
End Using
Return New JavaScriptSerializer().Serialize(files)
End Function
Screenshot
