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

晚安!

时间: 2024-09-14 18:14:06

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

ASP.NET MVC 3 Framework学习笔记之Model Templates

.使用模板化的视图Helpers(Using Templated View Helpers) 模版化视图helpers的创意就是它们更加灵活.我们不用自己去指定应该用什么HTML元素来呈现一个模型的属性,MVC自己会搞定,在我们更新了视图模型时,也不用手动的更新视图.下面是一个例子:  代码如下 复制代码 //在Models里面添加Persons.cs using System; using System.Collections.Generic; using System.Linq; using

《Pro ASP.NET MVC 3 Framework》学习笔记目录

<Pro ASP.NET MVC 3 Framework>简介: 作者: Adam Freeman 和 Steven Sanderson 出版社: Apress; New 平装: 820页 语种: 英语 ISBN: 1430234040 声明:笔记里面按我自己的理解翻译了大部分内容,写这个笔记的目的:为了方便自己查阅,也为园友提供学习的方便. 我无意侵犯作者的任何权利,仅仅为了自己学习.也希望路过的朋友不要用于任何商业目的. 第一部分 ASP.NET MVC3介绍   <Pro ASP.

《Pro ASP.NET MVC 3 Framework》学习笔记之一【MVC的历程,优点,HelloWorld】

序论:asp.net mvc出现已经有两三年的时间了(2009开始1.0版本),但是这么方面的中文学习资料仍然非常少,特别是asp.net mvc3,几乎就没有中文的学习书籍.在英文的书籍中有两本是非常经典的mvc3教程:<Professional ASP.NET MVC 3>--作者:Jon Galloway , Phil Haack, Brad Wilson , K. Scott Allen和<Pro ASP.NET MVC 3 Framework>--作者:Steven Sa

ASP.NET MVC Web API 学习笔记----HttpClient简介

  1. HttpClient简单介绍  依稀还记得那个时候用WebClient,HttpWebRequest来发送一个请求,现在ASP.NET MVC4中自带了一个类HttpClient,用于接收HttpResponseMessage和发送HttpRequestMesssage. 问题在于既然WebClient,HttpWebRequest可以完成相应的功能,为什么还要使用HttpClient类,.NET Framework中既然提出了这样一个类肯定是有其特别之处的,这里罗列几个不同之处: (

ASP.NET MVC Web API 学习笔记---联系人增删改查

本章节简单介绍一下使用ASP.NET MVC Web API 做增删改查.目前很多Http服务还是通过REST或者类似RESP的模型来进行数据操作的.下面我们通过创建一个简单的Web API来管理联系人          说明:为了方便数据不使用真正的数据库,而是通过内存数据模拟    1.       Web API中包含的方法 Action HTTP method Relative URI GetAllContact GET /api/contact GetContact GET /api/

《Pro ASP.NET MVC 3 Framework》学习笔记之二十七【视图1】

在前面很多的章节里面的,最常用的action result是视图呈现并返回给客户端的ViewResult类型.本章会专注于视图的原理,首先展示MVC框架是如何使用视图引擎处理ViewResults的,包括阐释如何创建一个视图引擎.接着介绍使用Razor视图引擎的一些技术.最后是关于创建和使用部分视图,子actions,以及Razor片段,这些都是涉及高效MVC开发的本质话题. 创建一个自定义视图引擎(Creating a Custom View Engine) MVC框架包含了两个内置的,功能完

《Pro ASP.NET MVC 3 Framework》学习笔记之二十八【视图2】

接着上一篇Views的笔记 在视图里导入命名空间(Importing Namespaces into a View) Razor视图通过一套常用的命名空间编译,这为我们省去了在使用常用类时指定必要的命名空间的麻烦.如果需要使用我们自己定义的类就必须引入命名空间或者是使用类的完整名称(包含了命名空间),如下所示: View Code @{ ViewBag.Title = "Index"; } Here is some data: @DynamicData.Infrastructure.M

ASP.NET MVC3 Razor视图引擎-“.NET技术”基础语法

I:ASP.NET MVC3在Visual Studio 2010中的变化 在VS2010中新建一个MVC3项目可以看出与以往的MVC2发生了很明显的变化. 1.ASP.NET MVC3必要的运行环境为.NET 4.0 (想在3.5用MVC3,没门!). 2.默认MVC3模板项目已集成 3.全新的Razor视图引擎 @{ ViewBag.Title = "Home Page";} <h2>@ViewBag.Message</h2><p> To lea

一起谈.NET技术,ASP.NET MVC3 Razor视图引擎-基础语法

I:ASP.NET MVC3在Visual Studio 2010中的变化 在VS2010中新建一个MVC3项目可以看出与以往的MVC2发生了很明显的变化. 1.ASP.NET MVC3必要的运行环境为.NET 4.0 (想在3.5用MVC3,没门!). 2.默认MVC3模板项目已集成 3.全新的Razor视图引擎 @{ ViewBag.Title = "Home Page";} <h2>@ViewBag.Message</h2><p> To lea