Hi mahesh213,
Check this example. Now please take its reference and correct your code.
Namespaces
using System.IO;
using System.Text.RegularExpressions;
using Microsoft.Office.Interop.Word;
Controller
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public JsonResult GetData()
{
List<FileData> files = new List<FileData>();
files.Add(new FileData { Id = 1, Name = "Test.doc", FileName = "~/Uploads/Test.doc" });
files.Add(new FileData { Id = 2, Name = "Test.pdf", FileName = "~/Uploads/Test.pdf" });
files.Add(new FileData { Id = 2, Name = "Test.docx", FileName = "~/Uploads/Test.docx" });
return Json(files, JsonRequestBehavior.AllowGet);
}
[HttpPost]
public string Preview(string path)
{
string extension = Path.GetExtension(Server.MapPath(path));
if (extension.ToLower() == ".doc" || extension.ToLower() == ".docx")
{
object documentFormat = 8;
string randomName = DateTime.Now.Ticks.ToString();
object htmlFilePath = Server.MapPath("~/Temp/") + randomName + ".htm";
string directoryPath = Server.MapPath("~/Temp/") + randomName + "_files";
object fileSavePath = Server.MapPath("~/Temp/") + Path.GetFileName(path);
//If Directory not present, create it.
if (!Directory.Exists(Server.MapPath("~/Temp/")))
{
Directory.CreateDirectory(Server.MapPath("~/Temp/"));
}
//Upload the word document and save to Temp folder.
System.IO.File.Copy(Server.MapPath(path), fileSavePath.ToString());
//Open the word document in background.
_Application applicationclass = new Application();
applicationclass.Documents.Open(ref fileSavePath);
applicationclass.Visible = false;
Document document = applicationclass.ActiveDocument;
//Save the word document as HTML file.
document.SaveAs(ref htmlFilePath, ref documentFormat);
//Close the word document.
((_Document)document).Close();
//Read the saved Html File.
string wordHTML = System.IO.File.ReadAllText(htmlFilePath.ToString());
//Loop and replace the Image Path.
foreach (Match match in Regex.Matches(wordHTML, "<v:imagedata.+?src=[\"'](.+?)[\"'].*?>", RegexOptions.IgnoreCase))
{
wordHTML = Regex.Replace(wordHTML, match.Groups[1].Value, "Temp/" + match.Groups[1].Value);
}
//Delete the Files from Temp folder.
DirectoryInfo directoryInfos = new DirectoryInfo(Server.MapPath("~/Temp/"));
foreach (FileInfo fileInfo in directoryInfos.GetFiles())
{
fileInfo.Delete();
}
foreach (DirectoryInfo directoryInfo in directoryInfos.GetDirectories())
{
directoryInfo.Delete(true);
}
return wordHTML;
}
else if (extension.ToLower() == ".pdf")
{
string embed = "<object data=\"{0}\" type=\"application/pdf\" width=\"300px\" height=\"300px\">";
embed += "If you are unable to view file, you can download from <a href = \"{0}\">here</a>";
embed += " or download <a target = \"_blank\" href = \"http://get.adobe.com/reader/\">Adobe PDF Reader</a> to view the file.";
embed += "</object>";
return string.Format(embed, VirtualPathUtility.ToAbsolute(path));
}
else
{
return "";
}
}
public class FileData
{
public int Id { get; set; }
public string Name { get; set; }
public string FileName { get; set; }
}
}
View
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Index</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.114/styles/kendo.default-v2.min.css" />
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="https://kendo.cdn.telerik.com/2020.1.114/js/angular.min.js"></script>
<script type="text/javascript" src="https://kendo.cdn.telerik.com/2020.1.114/js/kendo.all.min.js"></script>
<script type="text/javascript">
var app = angular.module("MyApp", ["kendo.directives"]);
app.controller("MyController", function ($scope, $timeout, $http, $sce) {
$scope.mainGridOptions = {
dataSource: { transport: { read: "/Home/GetData/" }, pageSize: 5 },
groupable: true,
sortable: true,
columns: [
{ field: "Id", title: "Id" },
{ field: "Name", title: "Name" },
{ field: "FileName", title: "File Name" },
{ template: "<a href='\\#' ng-click='Preview(\"#:data.FileName#\")'>Preview</a>", title: "Preview" }
]
};
$scope.Preview = function (path) {
$scope.IsWord = false;
$scope.IsPDF = false;
var extension = "." + path.substring(path.lastIndexOf('.') + 1, path.length)
$http({ method: 'POST', url: 'Home/Preview', params: { path: path} })
.then(function (response) {
$scope.Test = response.data;
if (extension == ".doc" || extension == ".docx") {
$scope.previewWord = $sce.trustAsHtml($scope.Test);
$scope.IsWord = true;
} else if (extension == ".pdf") {
$scope.previewPDF = $sce.trustAsHtml($scope.Test);
$scope.IsPDF = true;
}
});
return false;
}
})
</script>
</head>
<body>
<div ng-app="MyApp" ng-controller="MyController">
<kendo-grid options="mainGridOptions"></kendo-grid><hr />
<div ng-bind-html="previewWord" ng-show="IsWord"></div>
<div ng-bind-html="previewPDF" ng-show="IsPDF"></div>
</div>
</body>
</html>
Screenshot