前面一篇,讲解Nancy的基础,以及Nancy自宿主,现在开始学习视图引擎。
Nancy 目前支持两种 一个是SSVE 一个是Razor。下面我们一起学习。
The Super Simple View Engine
SSVE 全称就是 Super Simple View Engine ,翻译过来也就是 超级简单视图引擎。
我们在Nancy 不需单独引用,因为它是默认内置的。该引擎处理任何sshtml,html或htm文件。
模型可以是标准的类型,或ExpandoObject(或者实现 IDynamicMetaObjectProvider ,或者实现的IDictionary<string,object> 以访问其属性)。
SSVE是一个基于正则表达式的视图引擎,没有“执行代码”,所以你不能指定自己的代码来执行。内置的语法/命令,你可以使用如下所示。
下面来讲解一些常用的命令。
1.Model
2.Each
3.If
4.Partials
5.Master pages and sections
首先创建一个项目。建议创建web空项目 。
我是直接使用上次的项目 http://www.cnblogs.com/linezero/p/5121887.html
先创建一个Module SSVEModule
然后添加Views文件夹 -》然后再在其下添加 SSVE文件夹 -》添加对应的View 页。
这样使项目更加清楚。
1.Model
Get["/model"] = r =>
{
var model = "我是字符串";
return View["model", model];
};
在SSVE 文件夹下添加一个model.html
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
@Model
</body>
</html>
然后我们访问页面 访问地址: http://localhost:9000/ssve/model
2.Each
Get["/each"] = r =>
{
var arr = new int[] { , , , , , , , , };
return View["each", arr];
};
each.html
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
@Each
<p>@Current</p>
@EndEach
</body>
</html>
访问地址: http://localhost:9000/ssve/each
3.If
Get["/if"] = r =>
{
return View["if", new { HasModel = true }];
};
if.html
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
@If.HasModel
<p>我出现了</p>
@EndIf @IfNot.HasModel
<p>我没办法出现</p>
@EndIf
</body>
</html>
访问地址: http://localhost:9000/ssve/if
4.Partials
@Partial['header.html']
在SSVE 下添加header.html 然后在页面添加这句即可。
5.Master pages and sections
master.html
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
@Partial['header.html']
@Section['Content']
</body>
</html>
使用 master
@Master['master.html']
@Section['Content']
<p>master partial content 结合</p>
@Model
@EndSection
SSVEModule.cs
using Nancy;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks; namespace NancyDemo
{
public class SSVEModule : NancyModule
{
public SSVEModule():base("/ssve")
{
Get["/"] = r =>
{
var os = System.Environment.OSVersion;
return "Hello SSVE<br/> System:" + os.VersionString;
}; Get["/model"] = r =>
{
var model = "我是字符串";
return View["model", model];
}; Get["/each"] = r =>
{
var arr = new int[] { , , , , , , , , };
return View["each", arr];
}; Get["/if"] = r =>
{
return View["if", new { HasModel = true }];
};
}
}
}
SSVE视图引擎源码:https://github.com/grumpydev/SuperSimpleViewEngine
Razor View Engine
Razor 相信大家都是非常熟悉,所以也就不在这里过多做语法讲解。
主要是讲解在Nancy中使用Razor 视图引擎。
Nancy 的Razor 是自定义实现的,所以与ASP.NET MVC 中的Razor 有所不同。
在Nancy中绑定模型是@Model 不是ASP.NET MVC @model
安装
要在Nancy中使用Razor 需要安装 Nancy.ViewEngines.Razor
Nuget:Install-Package Nancy.Viewengines.Razor
添加Razor以后,会默认在app.config 添加Razor相关配置。
使用
建议大家新建一个空的web项目,这样便于编写视图。
在视图中声明 关键字为:@inherits
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase<dynamic>
其他语法与ASP.NET MVC Razor相同。
我还是在原项目上进行添加。
先创建一个Module RazorModule
然后添加Views文件夹 -》然后再在其下添加 Razor文件夹 -》添加对应的View 页。以 cshtml结尾的文件,也就是视图文件。
1.Model
Get["/index"] = r =>
{
var model = "我是 Razor 引擎";
return View["index",model];
};
index.cshtml
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase<dynamic>
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
@Model
</body>
</html>
访问地址: http://localhost:9000/razor/index
2.each
Get["/each"] = r =>
{
var arr = new int[] { , , , , , , , , };
return View["each", arr];
};
虽然Module中的代码与前面相同。但View 就不一样了。
each.cshtml
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase<dynamic>
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
@foreach (var item in Model)
{
<p>@item</p>
}
</body>
</html>
访问地址: http://localhost:9000/razor/each
RazorModule.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Nancy; namespace NancyDemo
{
public class RazorModule:NancyModule
{
public RazorModule() :base("/razor")
{
Get["/"] = r =>
{
var os = System.Environment.OSVersion;
return "Hello Razor<br/> System:" + os.VersionString;
}; Get["/index"] = r =>
{
var model = "我是 Razor 引擎";
return View["index",model];
}; Get["/each"] = r =>
{
var arr = new int[] { , , , , , , , , };
return View["each", arr];
};
}
}
}
项目结构
因为我使用的项目是控制台程序,Views 文件夹下的文件必须都要在 属性 选择 始终复制 。
在linux上运行可以参考上篇文章。
最后留个坑,下一篇:Nancy 学习-进阶部分 继续跨平台。请大家多多支持。
如果你觉得本文对你有帮助,请点击“推荐”,谢谢。