首页 > 代码库 > [asp.net mvc 奇淫巧技] 02 - 巧用Razor引擎在Action内生成Html代码
[asp.net mvc 奇淫巧技] 02 - 巧用Razor引擎在Action内生成Html代码
在web开发中经常会遇到在内部代码中获取Html,这些Html是需要和数据进行一起渲染。并不是直接把Html代码返回给客户端。这样的做法有很多应用场景,例如分页、Ajax一次性获取几段Html片段、生成邮件发送模板、生成Html静态页面等等。比较简单的或者容易想到的做法就是直接拼接Html,当然这肯定不是最合适的做法。
应用场景
1、在分页中,有一种做法是用ajax获取table的html代码和一些分页信息的Json
var json = { "table": "<table><tr/><td>1</td></tr></table>", "pageSize": 10, "currentIndex": 1, "count": 100}
2、Ajax一次性获取几段Html片段
var json = { "leftHtml": "<div><h1>HHHHHHHHHH</h1></div>", "rightHtml": "<table><tr/><td>1</td></tr></table>"}
3、生成邮件发送模板、生成Html静态页面
我们经常会生成一些邮件模板,比如推广一些产品的html代码。
生成Html静态页面就更加常用了。
应用场景分析
我们这些应用都是在内部代码中生成html,然后在对html代码进行处理,比如拼接成json,或者发送邮件,在或者生成静态html页面。
生成Html在asp.net中莫过于Razor引擎,总之就是很好用,语法也很强大,如果我们把需要生成的html用Razor引擎生成岂不是很好,如果熟悉asp.net mvc 管道的话就可以很简单的解决这个问题。
1、查找View(cshtml)
可以用ViewEngines.Engines.FindView查找View。
public virtual ViewEngineResult FindView(ControllerContext controllerContext, string viewName, string masterName);
FindView需要ControllerContext、viewName和masterName,其中masterName是母版视图的名称目前可以忽略。
viewName就是我们需要查找的View,查找View的方式和在Action中return View(string viewName)的方式一致,也就是说有两种方式,一个是全路径,如:"~/Views/Home/Html1.cshtml",必须带后缀名cshtml。还有一种方式是直接写"Html1",也就是相对路径, 如果cshtml文件的位置不在Controller所对应的文件夹中,则可以写"../Folder/Html1"。此方式同样适应于普通执行Controller中Action直接return View(string viewName)。
ControllerContext是封装有关与指定的 System.Web.Routing.RouteBase 和 System.Web.Mvc.ControllerBase 请求的信息
public ControllerContext(RequestContext requestContext, ControllerBase controller);
在构造函数中需要RequestContext和ControllerBase,ControllerBase就是this,RequstContext可以在Action中和容易的获取。
最终查找View的代码
ControllerContext context = new ControllerContext(Request.RequestContext, this);ViewEngineResult result = ViewEngines.Engines.FindView(context, "Html1", "");
2、Render View
最终我们需要执行View的Render方法,来获取生成的html
void Render(ViewContext viewContext, TextWriter writer);
Render 代码
using (var sw = new StringWriter()){ var viewContext = new ViewContext(context, result.View, context.Controller.ViewData, context.Controller.TempData, sw); result.View.Render(viewContext, sw); string html = sw.ToString(); }
代码中html就是我们需要获取的html。
传递数据至View
如何传递数据至View,这个和普通的Action执行一致,也就是说我们熟悉的ViewBag,ViewData,TempData以及Model都可以用。
1、设置数据
在调用View.Render前设置数据即可。
context.Controller.ViewBag.Name = "Emrys"; context.Controller.ViewData["Age"] = 10;context.Controller.TempData["City"] = "上海"; context.Controller.ViewData.Model = new UserInfo { Name = "Emrys", Age = 10, City = "上海" };
2、在View(html)获取数据,也就是Html1.cshtml中的Razor代码。
@{ Layout = null;} @model UserInfo Name:@ViewBag.Name<br />Age:@ViewData["Age"]<br />City:@TempData["City"]<br />Name:@Model.Name<br />Age:@Model.Age<br />City:@Model.City
总结
最终Action中的代码
ControllerContext context = new ControllerContext(Request.RequestContext, this);ViewEngineResult result = ViewEngines.Engines.FindView(context, "Html1", "");context.Controller.ViewBag.Name = "Emrys";context.Controller.ViewData["Age"] = 10;context.Controller.TempData["City"] = "上海";context.Controller.ViewData.Model = new UserInfo { Name = "Emrys", Age = 10, City = "上海" };using (var sw = new StringWriter()){ var viewContext = new ViewContext(context, result.View, context.Controller.ViewData, context.Controller.TempData, sw); result.View.Render(viewContext, sw); string html = sw.ToString(); }
这样我们就可以巧用Razor获取我们需要和数据组合的html代码,以供我们使用。
最后望对各位有所帮助,本文原创,欢迎拍砖和推荐。
[asp.net mvc 奇淫巧技] 02 - 巧用Razor引擎在Action内生成Html代码