ASP.NET MVC Razor
Razor是MVC3中才有的新的视图引擎。我们知道,在ASP.NET中,ASPX的视图引擎依靠<%和%>来调用C#指令。而MVC3以后有了一套新的使用@标记的Razor语法,使用起来更灵活更简洁。下面通过一些简单示例让大家快速撑握Razor语法的使用。
准备工作
在演示Razor语法的使用之前,我们需要做一些准备工作。
1.打开VS创建一个ASP.NET MVC空项目,很简单,就不具体演示了。
2.添加一个Model。在项目的Models文件夹中添加一个名为Product的类。在这我们把前一篇C#知识点提要用到的Product类搬过来用。代码如下:
namespace MvcApplication1.Models {
public class Product {
public int ProductID { get; set; }
public string Name { get; set; }
public string Description { get; set; }
public decimal Price { get; set; }
public string Category { set; get; }
}
}
3.添加一个Controller。右击项目中的Controllers文件夹,选择添加控制器,命名如下图所示:
点添加后,对ProdcutController中的代码进行如下编辑:
using System.Web.Mvc;
using MvcApplication1.Models; namespace MvcApplication1.Controllers
{
public class ProductController : Controller
{
public ActionResult Index()
{
Product myProduct = new Product {
ProductID = 1,
Name = "苹果",
Description = "又大又红的苹果",
Category = "水果",
Price = 5.9M
};
return View(myProduct);
}
}
}
4.添加一个View。右击Index方法,选择添加视图,在弹出的窗口进行如下配置:
点添加后,系统自动帮我们创建一个Product文件夹和一个Index.cshtml文件,Index.cshtml内容如下:
@model MvcApplication1.Models.Product @{
ViewBag.Title = "Index";
} <h2>Index</h2>
5.修改默认路由。为了方便,我们应该让应用程序启动时直接导向我们需要的请求处理(此处是Product/Index)。打开Global.asax文件,找到注册路由RegisterRoutes方法下的routes.MapRoute方法,把controller的值改为“Product”,如下所示:
routes.MapRoute(
"Default", // 路由名称
"{controller}/{action}/{id}", // 带有参数的 URL
new { controller = "Product", action = "Index", id = UrlParameter.Optional } // 参数默认值
);
先不管这些是什么意思,我会在后面的文章中专门介绍路由。到这,我们可以按F5,程序能正常运行,准备工作就做好了。
使用Model对象
介绍Razor语法,让我们从Index.cshtml文件的第一行开始:
@model MvcApplication1.Models.Product
Razor语句都是以@符号开始的。每个视图都有自己的Model属性(通过@Model调用)。上面这句代码的意思是将本视图的Model属性的类型指向MvcApplication1.Models.Product类型,这就实现了强类型。强类型的好处之一是类型安全,如果写错了Model对象的某个成员名,编译器会报错;另一个好处是在VS中可以使用VS中的代码智能提示自动完成类型成员调用的代码编写。 当然这句代码不要程序也可以正常运行,只是给编写代码造成了一定的困难。
视图中的Model属性用于存放控制器(Controller)传递过来的model实例对象(本示例中ProductController通过“return View(myProduct)”传递给Index视图),下面的代码演示了如何调用该model对象:
@model MvcApplication1.Models.Product @{
ViewBag.Title = "Index";
}
<!-- 调用Product实例的Name属性 -->
<h2>名称:@Model.Name</h2>
注意,第一行代码用于声名Model属性类型用的是@model <Model类型名>(小写m),而调用控制器传递过来的Model对象用的是@Model.<属性名>(大写M)。按F5运行效果如下:
使用表达式
上面讲的使用Model对象是很常用的一种Razor代码。其实上面示例中的@Model.Name就是一个简单的表达式,表示向Web页面呈现Model.Name的文本值。Razor语法中的表达式除了可以使用Model对象,也可以使用几乎任何一个其他可访问权限范围内的对象,来向Web面面输出该对象成员的文本值。如下代码所示:
@model MvcApplication1.Models.Product @{
ViewBag.Title = "Index";
} 现在的时间是: @DateTime.Now.ToShortTimeString()
运行效果如下:
这种使用对象的简单表达式(@DateTime.Now.ToShortTimeString()和@Model.Name),在这我们不防称之为对象表达式。
除了对象表达式,还可以是其他任意的有返回值的表达式,如条件表达式。如下面代码所示:
@model MvcApplication1.Models.Product @{
ViewBag.Title = "Index";
} 现在的时间是: @DateTime.Now.ToShortTimeString() <br/>@(DateTime.Now.Hour>22 ? "还早,再写一会吧!" : "该睡觉咯!")
运行效果如下:
注意,一般使用非对象表达式时都需要用小括号括起来。
使用代码块
和表达式的使用方式一样,Razor语法中也可以使用由{}括起来的单个C#过程控制代码块(如if、switch、for等)。使用方式如下:
@model MvcApplication1.Models.Product @{
ViewBag.Title = "Index";
} @if (Model.Price > 5M) {
string test = "买不起!";
<p>@Model.Name <b>太贵了!</b> @test </p>
}
效果如下:
由{}括起来的代码块内可以写任何C#代码,也可以使用任何HTML标签。但需注意的是,当控制语句内只有一句代码时不能像写C#后台代码一样省略大括号。
还有一种更常用的使用代码块的方式。你也可以通过以@{开始,以}闭合的方式来使用代码块,它可以把多个代码块放在一起,开成一个更大的代码块。如下代码所示:
@model MvcApplication1.Models.Product @{
ViewBag.Title = "Index";
}
@{
if(Model.Category=="水果"){
string test="是一种水果。";
@Model.Name @test
}
if (Model.Price > 5M) {
string test = "买不起!";
<p>@Model.Name <b>太贵了!</b> @test </p>
}
}
运行结果如下:
使用@:和text标签
我们注意到,在代码块中,要么是C#代码,要么是HTML标签,不能直接写纯文字,纯文字须包裹在HTML标签内。但如果需要在代码块中直接输出纯文字而不带HTML标签,则可以使用@:标签,在代码块中输出纯文本文字非常有用。如下代码所示:
... @if (Model.Price > 5M) {
@Model.Name@:太贵了 。
<br />
@: @@:后面可以是一行除@字符以外的任意文本,包括<、>和空格,怎么写的就怎么输出。
<br />
@: 如果要输出@符号,当@符号前后都有非敏感字符(如<、{、和空格等)时,可以直接使用@符号,否则需要使用两个@符号。
}
注意@符号的使用。上面代码运行效果如下:
使用@:标签在代码块中输出一行不带html标签的文本非常方便,但如果需要在代码块中输出续或不连续的多行纯文本,则使用text标签较为方便,如下代码所示:
... @if (Model.Price > 5M) {
<text> 名称:<b>@Model.Name</b><br />
分类:<b>@Model.Description</b><br />
价钱:<b>@Model.Price</b><br /> <pre>
测试行一: <a>aaaa</a>
测试行二: @@ fda@aaa
</pre> </text>
}
运行结果:
使用ViewBag
上面讲了通过Model对象来从Controller传递数据到View。和Model对象一样,ViewBag对象也可以用来从Controller传递数据到View。下面代码演示了如何在ProductController中使用ViewBag:
public ActionResult Index()
{
Product myProduct = new Product {
ProductID = 1,
Name = "苹果",
Description = "又大又红的苹果",
Category = "水果",
Price = 5.9M
};
ViewBag.TestString = "这是一行测试文字!";
return View(myProduct);
}
不一样的是,ViewBag是动态类型,其中TestString是自己定义的。ViewBag在View中的使用方式是和Model一样,如下:
... 动态表达式解析的时间是:@ViewBag.TestString
运行结果就不贴图了。
使用Layuot
前面我们创建一个视图的时候,我们勾选了使用布局和母版页,但没有告诉VS使用哪一个。请仔细看下图:
这个对话框告诉我们“如果在Razor _viewstart中设置了此选项,则留空”。在项目的Views文件夹中,我们可以看到一个_ViewStart.cshtml文件,里面的内容是:
@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
MVC呈现视图的时候,默认情况下会自动查找_ViewStart.cshtml文件,以它作为母版来呈现用户请求的视图。母版的呈现是MVC内部处理的,这种以下划线(_)开头的视图文件,一般是不能直接返回给用户。
使用布局或母版页的好处是,我们不需要在每个视图中都设置一份相同的内容。按照_ViewStart.cshtml文件内容指示的路径,我们找到_Layout.cshtml文件,打开它会发现我们在Index视图中定义的 ViewBag.Title = "Index" 就是在这里调用的:
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
</head> <body>
@RenderBody()
</body>
</html>
类似于ASP.NET母版页中的ContentPlaceHolder服务器控件,在MVC中使用@RenderBody()来呈现子Web页面的内容,它可以省去我们在每个视图文件中写相同的html元素、JS和样式等的工作。
如果创建一个视图不想使用Layout,则可以在创建视图的对话框取消“使用布局和母版页”选项,创建后会生成如下代码:
@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<title>About</title>
</head>
<body>
<div> </div>
</body>
</html>
由于没有使用Layout,视图中必须包含用于呈现HTML页面每个基本元素,而且必须指定Layout=null。
ASP.NET MVC Razor的更多相关文章
- ASP.NET MVC Razor语法
ASP.NET MVC Razor语法 (一) 关于_ViewStart.cshtml文件 使用Razor模板引擎的话,会自动生成一个_ViewStart.cshtml文件.事实上,_View ...
- ASP.NET没有魔法——ASP.NET MVC Razor与View渲染 ASP.NET没有魔法——ASP.NET MVC界面美化及使用Bundle完成静态资源管理
ASP.NET没有魔法——ASP.NET MVC Razor与View渲染 对于Web应用来说,它的界面是由浏览器根据HTML代码及其引用的相关资源进行渲染后展示给用户的结果,换句话说Web应用的 ...
- Asp.net MVC Razor视图模版动态渲染PDF,Razor模版生成静态Html
Asp.net MVC Razor视图模版动态渲染PDF,Razor模版生成静态Html 1.前言 上一篇文章我开源了轮子,Asp.net Core 3.1 Razor视图模版动态渲染PDF,然后,很 ...
- ASP.NET MVC: Razor中的@:和语法
本文将讨论新版Razor里视图引擎中支持的两个有用的语法功能:@:和<text>语法. 用Razor实现流畅编程 ASP.NET MVC 3配有一个新的名为“Razor”的视图引擎选项(除 ...
- Asp.net MVC Razor模板引擎技巧分享
Razor是Asp.net MVC中新的默认模板类型, 语法简单易用.这篇文章不涉及Razor的语法,主要介绍Razor的一些在MVC项目中的使用技巧,以及脱离MVC环境下,如何使用Razor. 阅读 ...
- ASP.NET MVC Razor视图引擎攻略
--引子 看下面一段MVC 2.0的代码. <%if (Model != null){%> <p><%=Model%></p><%}%>&l ...
- ASP.NET Mvc Razor视图语法
在ASP.NET MVC中有两套模版引擎,一套是ASPX,一套是Razor,从事过WebForms开发的朋友们,对于ASPX模版已经很熟悉了,下面我说一下我所熟悉的Razor模版引擎的一些语法,供大家 ...
- Asp.net MVC razor语法参考
Razor语法的快捷参考http://haacked.com/archive/2011/01/06/razor-syntax-quick-reference.aspx/ 只是copy下来便于查阅! I ...
- MvcMailer通过ASP.NET MVC Razor视图和基架发送邮件
MvcMailer是一个有趣的组件,您可以使用ASP.NET MVC框架在发送邮件.很重要的是,它使用Razor视图引擎的观点作为电子邮件模板和很容易安装和使用.在本文中你将看到如何安装,设置邮件模板 ...
随机推荐
- 软件工程 Coding.net代码托管平台 Git初学者的使用总结 五步完成 程序,文件,文件夹的Git
一.前言 第一次用git相关的命令行,我使用的是Coding.net代码托管平台.Coding.net 自主打造的基于 Git 的代码托管平台,提供高性能的远端仓库,还有保护分支,历史版本分屏对比. ...
- C# 操作数据库表和数据库
<1>c#创建数据库表: private void CreatTable(string name) //创建数据库源数据表,name为表名 { con.ConnectionStr ...
- Git-TortoiseGit完整配置流程
每次使用Git的时候都或多或少遇到些问题,为了方便以后少踩一些坑,把自己踩过的坑记录一下,加深对Git使用的理解,所以写下这篇日记记录一下. 本文需要频繁使用cmd,如果使用系统的cmd会稍微有点不便 ...
- 一个简单的inno setup模板
一.模板代码 基本功能包括多路径安装.多语言.自定义图标. [Setup] ShowLanguageDialog=yes AppCopyright=Copyright Reserved(C) , 36 ...
- .Net(c#)加密解密之Aes和Des
.Net(c#)加密解密工具类: /// <summary> /// .Net加密解密帮助类 /// </summary> public class NetCryptoHelp ...
- C#根据句柄改变窗体控件值
需求是这样,有个程序界面我们需要通过自己的程序持续输入数据,界面如图. 可以获得控件的句柄而用钩子写入值.这里需要用到spy++工具.在VS的工具下有个spy++工具,打开如下图 通过这个工具可以获得 ...
- js的touch事件的实际引用
一开始做前端页面的时候,接触的也是js,但是随后便被简单高效的jquery吸引过去,并一直使用至今. 而js,则被我主观的认为底层技术而抛弃. 直到这几天工作需要,研究移动端页面的触屏滑动事件,搜索j ...
- 常用html、CSS、javascript前端命名规范
无论是从技术角度还是开发视角,对于web前端开发规范文档都有一定规范,本文就css3和html5的发展前景总结了一系列的web开发文档,仅供大家参考. 规范目的: 为提高团队协作效率, 便于后台人员添 ...
- mybatis中的#和$的区别(转)
#相当于对数据 加上 双引号,$相当于直接显示数据 1. #将传入的数据都当成一个字符串,会对自动传入的数据加一个双引号.如:order by #user_id#,如果传入的值是111,那么解析成sq ...
- 关于Java数组
今天,我们将要谈到的是Java里的数组 数组是一种容器,它是一些相同类型元素的集合.我们可以用数组,去存储一些相同类型的数据,比如,整数,浮点数,字符,...事实上,数组甚至可以用来存储同一个类的多个 ...