《Pro ASP.NET MVC 3 Framework》学习笔记之七【MVC3 Razor视图引擎的@句法】

简介:

继续完成上次提到的第二部分的笔记:Razor视图引擎

1.Razor是什么:

Razor是MVC3里面提供的一个新的视图引擎。ASP.NET视图引擎通过寻找包含服务端指令的特殊元素用来处理web页,正如我们早期所注意到的那样,标准的ASPX视图引擎依赖<%和%>元素,这对于我们来说是非常熟悉的。通过Razor,MVC的开发团队引入了一套以@为中心的新句法元素。一般来说,只要我们熟悉了<%%>的语法,对Razor的使用就不会有太大的问题,尽管可能有一些新的规则。

2.Razor的使用
step1:创建一个空的MVC3的项目Razor,并添加一个Product.cs的Model,如下所示:

复制代码
namespace Razor.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 { get; set; }
}
}
复制代码

step2:添加Controller,如下所示:

复制代码
    public class ProductController : Controller
{

//GET: /Product/

public ActionResult Index()
{
Product myProduct = new Product
{
ProductID = 1,
Name = "Kayak",
Description = "A boat for one person",
Category = "Watersports",
Price = 275M
};

ViewBag.ProcessingTime = DateTime.Now.ToShortTimeString();
ViewData["ProcessingTime"] = DateTime.Now.ToShortTimeString();
return View(myProduct);
}
}
复制代码

这里我们简单的创建一个Controller,将一个Product实体传给View显示,上面还出现了ViewBag,ViewData。这两个属性前面的笔记有过介绍,用于Controller和View之间的数据传递,关于ViewBag和ViewData我们选择哪一个来传递,其实主要看个人的喜好,并没有说ViewBag一定比ViewData要好。

step3:添加一个强类型的View--Index.cshtml,怎么添加强类型的View前面的比较有介绍哈,不清楚的朋友可以去看下前面的笔记。View如下所示:

复制代码
@model Razor.Models.Product
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
@{
ViewBag.Title = "Index";
}
<title>@ViewBag.Title</title>
</head>
<body>
<div>
<h2>
Name:@Model.Name</h2>
</div>
</body>
</html>
复制代码



step4:为了方便我们运行程序,我们将程序运行后的路由设置更改为我们当前的Controller,路由的相关设置在Global.asax里面进行,如下所示:

复制代码
        public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(
"Default", // 路由名称
"{controller}/{action}/{id}", // 带有参数的 URL
new { controller = "Product", action = "Index", id = UrlParameter.Optional } // 参数默认值
);

}
复制代码

跟我一样的初学的MVC不要被这里的路由系统困扰,没有必要着急哈,后面有专门的章节来进行阐释Routes System(路由系统)。现在就现在这样改下就OK了。

step5:具体看下我们创建的Razor视图,下面是一部分截图:

我们先重点看下红色方框里面的语句,@model Razor.Models.Product,因为我们创建的是强类型的,所以有这么一条语句;如果不是强类型的则没有。"@model"用来指明具体的View要呈现的Model类型,注意这里的model是小写的m。而当我们引用一个model对象时,我们使用@Model,大写M。这时运行程序显示:Name:Kayak。

接着我们在Index.cshtml里面继续添加代码,暂且在" <h2>Name:@Model.Name</h2>"的下面添加这样一条语句:Time view rendered: @DateTime.Now.ToShortTimeString(),注意这里使用的是@,我们要慢慢习惯这种写法。这里我们使用了@Model.属性名,这样属性的值就写在了页面上了。@符号处理复杂的代码快也是这样使用。

如果我们不想显示任何html标签,只是想显示文本,可以这样写"@:"后面跟我们要显示的信息。运行程序后,你可以查看源文件确认下是不是没有添加任何的html标签,呵呵。当然如果你要添加很多行的文本,你可以使用<text></text>,这就相当于给你每行都加上"@:"。

3.使用Layouts

在Views/Shared下有一个_Layout.cshtml,我们在创建View的时候,对话框里面也有选择使用布局的Checkbox。MVC默认会去寻找_ViewStart.cshtml.在这个页面我可以决定引入哪些Layouts。注意这里又有个约定:命名是以下划线开始的View不会直接呈现给客户端的,即使是直接在URL里面请求也不会返回给Client端。_Layout.cshtml等效于MasterPage.下面是一个_Layout.cshtml:

复制代码
<!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.4.4.min.js")"
type="text/javascript"></script>
</head>
<body>
@RenderBody()
</body>
</html>
复制代码

这里的@ViewBag.Title定义也可以算是一个约定,当我们在其他的View里面引用了这个_Layout.cshtml,这个地方就相当于一个占位符,可以动态的根据我们的需要显示Title。这种方式就替代了palceholder.在Razor里面使用RenderBody()来呈现我们View的Body部分,因为当我们引入了_Layout.cshtml时,我们写的都是Body部分,其他的要引入的css,js文件都可以在_Layout.cshtml里面添加,这样在其他的引入了它的View里面就不用重复添加了。当然_Layout.cshtml是可以选的,你可以选择不用_Layout.cshtml.但是我们要在View里面显示的添加@{Layout=null;},如果你没有明确这一点就会默认引用_ViewStart.cshtml。

今天的笔记做到这里,我也是刚学习MVC,做笔记是为了巩固和加深理解,当然如果能给到那些跟我一样的初学者一点点的帮助,我就非常高兴了。笔记里面肯定会有理解不准确和错误的地方,还请路过的大牛们多多帮助指导。谢谢!
祝路过的朋友工作顺利!

晚安!

本文转自Rt-张雪飞博客园博客,原文链接http://www.cnblogs.com/mszhangxuefei/archive/2011/12/08/mvcnotes_7.html如需转载请自行联系原作者


张雪飞

相关文章
|
3月前
|
开发框架 前端开发 .NET
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
38 0
|
1月前
|
开发框架 前端开发 .NET
C# .NET面试系列六:ASP.NET MVC
<h2>ASP.NET MVC #### 1. MVC 中的 TempData\ViewBag\ViewData 区别? 在ASP.NET MVC中,TempData、ViewBag 和 ViewData 都是用于在控制器和视图之间传递数据的机制,但它们有一些区别。 <b>TempData:</b> 1、生命周期 ```c# TempData 的生命周期是短暂的,数据只在当前请求和下一次请求之间有效。一旦数据被读取,它就会被标记为已读,下一次请求时就会被清除。 ``` 2、用途 ```c# 主要用于在两个动作之间传递数据,例如在一个动作中设置 TempData,然后在重定向到另
95 5
|
8月前
|
存储 开发框架 前端开发
[回馈]ASP.NET Core MVC开发实战之商城系统(五)
经过一段时间的准备,新的一期【ASP.NET Core MVC开发实战之商城系统】已经开始,在之前的文章中,讲解了商城系统的整体功能设计,页面布局设计,环境搭建,系统配置,及首页【商品类型,banner条,友情链接,降价促销,新品爆款】,商品列表页面,商品详情等功能的开发,今天继续讲解购物车功能开发,仅供学习分享使用,如有不足之处,还请指正。
114 0
|
9月前
|
开发框架 前端开发 .NET
[回馈]ASP.NET Core MVC开发实战之商城系统(三)
[回馈]ASP.NET Core MVC开发实战之商城系统(三)
66 0
|
9月前
|
开发框架 前端开发 .NET
[回馈]ASP.NET Core MVC开发实战之商城系统(一)
[回馈]ASP.NET Core MVC开发实战之商城系统(一)
113 0
|
9月前
|
SQL 开发框架 前端开发
[回馈]ASP.NET Core MVC开发实战之商城系统(开篇)
[回馈]ASP.NET Core MVC开发实战之商城系统(开篇)
142 0
|
9月前
|
开发框架 缓存 JSON
ASP.NET Core MVC 从入门到精通之Filter
ASP.NET Core MVC 从入门到精通之Filter
120 0
|
9月前
|
开发框架 前端开发 .NET
ASP.NET Core MVC 从入门到精通之自动映射(二)
ASP.NET Core MVC 从入门到精通之自动映射(二)
60 0
|
5月前
|
开发框架 自然语言处理 前端开发
基于ASP.NET MVC开发的、开源的个人博客系统
基于ASP.NET MVC开发的、开源的个人博客系统
51 0
|
8月前
|
SQL 开发框架 前端开发
[回馈]ASP.NET Core MVC开发实战之商城系统(完:内附源码)
经过一段时间的准备,【ASP.NET Core MVC开发实战之商城系统】已经完成,目前代码已开发完成,先将全部内容整理分享,如有不足之处,还请指正。
106 0