一、视图的作用

视图的职责是向用户提供界面。从ASP.NET MVC3开始,视图数据也可以通过ViewBag属性访问。例如:ViewBag.Message 就等于ViewData["Message"]。

下面来快速浏览一个视图的例子。如下代码片段所示:

 @{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<title>Sample</title>
</head>
<body>
<div>
@ViewBag.Message
</div>
</body>
</html>

这是一个极其简单的视图,实现了通过@ViewBag.Message表达式来显示控制器设置的消息。这里需要注意的重要一点事,视图不想ASP.NET Web Forms和PHP一样,它本身不会被直接访问,浏览器不能指向一个视图并渲染它。而是通过控制器来渲染。通过下面控制器来渲染上面的视图,控制器将ViewBag.Message属性的值设置成一个字符串,然后返回一个名为Sample的视图。如下代码片段所示:

  public class HomeController : Controller
{
public ActionResult Sample()
{
ViewBag.Message = "Hello world.";
return View("Sample");
}
}

二、指定视图

按照约定,每个控制器在Views目录下都有一个对应的文件夹,其名称与控制器一样,只是没有Controller后缀名而已。例如:控制器HomeController在Views目录下应该对应有个名为Home的文件夹。

1.返回默认视图

在每一个控制器的View文件夹中,每一个操作方法都有一个名称相同的视图文件与之相对应。这就提供了视图与操作方法关联的基础。例如下面代码片段所示:

 public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.Message = "欢迎使用 ASP.NET MVC!"; return View();
}
}

当不指定返回视图名称时(return View();),操作方法返回的ViewResult对象将按照约定来确定视图。它首先在目录/Views/ControllerName下查找控制器名称(不带Controller后缀)相同的视图。通过这种方法选择的视图便是/Views/Home/Index.cshtml。

2.返回不同的视图

如果想让Index操作方法渲染一个不同的视图,可以向其提供一个不同的视图名称,例如下面代码片段所示:

  public ActionResult Index()
{
ViewBag.Message = "欢迎使用 ASP.NET MVC!"; return View("NotIndex");
}

3.返回完全不同目录结构中的视图

在一些情形下,甚至需要制定完全位于不同目录结构中的视图。这样可以使用带有~符号的语法来提供视图的完整路径,但是为了在查找视图时避开视图引擎的内部查找机制,在使用这种语法时,必须提供视图的文件扩展名。例如下面代码片段所示:

  public ActionResult Index()
{
ViewBag.Message = "欢迎使用 ASP.NET MVC!";
return View("~/Views/Example/Index.cshtml");
}

三、强类型视图

         public ActionResult List()
{
var albums = new List<Album>();
for (int i = ; i < ; i++)
{
albums.Add(new Album { Title = "Title" + i });
}
ViewBag.Albums = albums;
return View();
}
 <ul>
@foreach (dynamic a in ViewBag.Albums) {
<li>@a.Title</li>
}
</ul>

四、Razor视图引擎

Razor中的核心转换字符是@。这个单一字符用做标记-代码的转换字符,有时也反过来用作代码-标记的转换符。这里一共有两种基本类型的转换:代码表达式和代码块。求出表达式的值,然后将值写入响应中。以下是Razor语法示例:

1.隐式代码表达式

Razor: <span>@model.Message</span>

WebForms: <span><%:model.Message%></span>

Razor中隐式代码表达式总是采用HTML编码方式。

2.显示代码表达式

Razor:<span>ISBN@(isbn)</span>

WebForms: <span>ISBN<%: isbn %></span>

3.无编码代码表达式

在一些情况下,需要明确地渲染一些不应该采用HTML编码的内容,这时候可以采用Html.Raw方法来保证这些内容不被编码。

Razor:<span>@Html.Raw(model.Message)</span>

Web Forms:<span><%:Html.Raw(model.Message)%></span>

<span><%=model.Message %></span>

4.代码块

Razor: @{

int x=123;

string y="because";

}

Web Forms:<%

int x=123;

string y="bacause";

%>

5.文本和标记相结合

Razor:@foreach(var item in items){

<span>Item@item.Name.<.span>

}

Web Forms:<% foreache(var item in items){%>

<span>Item<%:item.Name%>.</span>

<%}%>

6.混合代码和纯文本

Razor:@if(showMessage){

<text>This is plain text</text>

}

@if(showMessage){

@:This is plain text.

}

Web Forms:<% if(showMessage){%>

This is plain text.

<%}%>

Razor可以采用两种不同的方式来实现代码和纯文本的混合。第一种方式是使用<text>标签,这样只是把标签内容写入到响应中,而标签本身则不写入。

7.转义代码分隔符

可以用“@@”来编码“@”以达到显示“@”的目的。

Razor:My Twitter Handle is @hacked

My Twitter Handle is @@haacked

Web Forms:&lt;%expression%&gt; marks a code nugget.

8.服务器端的注释

Razor:@*

This is a multiline server side comment.

@if(showMessage){

<h1>@ViewBag.Message</h1>

}

All of this is commented out.

*@

Web Forms: <%--

This is a multiline server side comment.

<%if(showMessage){%>

<h1>@<%:ViewBag.Message%></h1>

<% }%>

All of this is commented out.

--%>

9.调用泛型方法

Razor:@(Html.SomeMethod<AType>())

Web Forms:<%:Html.SomeMethod<AType>()%>

五、布局

Razor布局和Web Forms中的母版页作用是相同的,但是前者提供了更加简洁的语法和更大的灵活性。下面演示了一个非常简单的布局:

 <!DOCTYPE html>

 <html>
<head>
<title>@ViewBag.Title</title>
</head>
<body>
<h1>@ViewBag.Title</h1>
<div>
@RenderBody()
</div>
</body>
</html>

看起来与普通的视图没有什么差别,但是视图布局中有个@RenderBody调用,这是一个占位符,用来标记使用这个布局的视图主要内容的位置。下面代码引用了该视图来渲染:

 @{
Layout = "~/Views/Shared/SiteLayout.cshtml";
ViewBag.Title = "主页";
} <h2>@ViewBag.Message</h2>
<p>
This is the main content!
</p>

布局可能有多个节,可以在上面模板的基础上添加一个页脚节:

 <!DOCTYPE html>

 <html>
<head>
<title>@ViewBag.Title</title>
</head>
<body>
<h1>@ViewBag.Title</h1>
<div>
@RenderBody()
</div>
<footer>@RenderSection("Footer")</footer>
</body>
</html>
 @{
Layout = "~/Views/Shared/SiteLayout.cshtml";
ViewBag.Title = "主页";
} <h2>@ViewBag.Message</h2>
<p>
This is the main content!
</p> @section Footer{
This is the <strong>footer</strong>.
}

注意:默认在不加@section为布局定义中一个节指定内容时会报错,所以,必须为每个节都提供内容,但是,RenderSection方法有个重载版本,允许指定不需要的节。可以给required参数传递一个false值来标记Footer节是可选的:

<footer>@RenderSection("Footer",false)</footer>

也可以:

 <!DOCTYPE html>

 <html>
<head>
<title>@ViewBag.Title</title>
</head>
<body>
<h1>@ViewBag.Title</h1>
<div>
@RenderBody()
</div>
<footer>@if (IsSectionDefined("Footer")) {
RenderSection("Footer");
} else {
<span>This is the default footer.</span>
}
</footer>
</body>
</html>

六、ViewStart

加入每个视图都使用Layout属性来指定他的布局,如果多个视图使用同一个布局,就会产生冗余,并且很难维护。_ViewStart.cshtml页面可以用来消除这种冗余。他的代码先于同目录下任何视图代码的执行。也可以递归地应用到子目录下的任何视图。当创建默认的mvc3的项目时,会在Views目录下自动添加了一个_ViewStart.cshtml文件,他制定了一个默认布局。

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

因为这个代码优先任何视图运行,所以一个视图可以重写Layout属性的默认值,从而选择一个不同的布局。

7、指定部分视图

除了返回视图之外,操作方法也通过PartialView方法以PartialViewResult的形式返回分部视图,代码如下:

     public class HomeController : Controller
{
public ActionResult Message() {
ViewBag.Message = "this is a partial view";
return PartialView();
}
}

使用Jquery将一个分部视图加载到一个使用了AJAX调用的当前视图中:

 <div id="result"></div>

 <script type="text/javascript">
$(function () {
$('#result').load('/home/message');
});
</script>

《asp.net mvc3 高级编程》第三章 视图的更多相关文章

  1. ASP.NET MVC5 高级编程 第3章 视图

    参考资料<ASP.NET MVC5 高级编程>第5版 第3章 视图 3.1 视图的作用 视图的职责是向用户提供界面. 不像基于文件的框架,ASP.NET Web Forms 和PHP ,视 ...

  2. 《asp.net mvc3 高级编程》第一章

    以前项目中用过mvc2,虽然mvc4早已出来,但手头只有mvc3的书籍,索性就学学MVC3吧. asp.net mvc 3 概述 (1)友好的试图表达,其中包括新的Razor视图引擎 (2)支持.NE ...

  3. 《asp.net mvc3 高级编程》第二章 控制器

    一.控制器的角色 MVC模式中的控制器(Controller)主要负责响应用户的输入,并且在响应时通常会修改模型(Model).通过这种方式,MVC模式中的控制器主要关注的是应用程序流,输入数据的处理 ...

  4. ASP.NET MVC5 高级编程 第5章 表单和HTML辅助方法

    参考资料<ASP.NET MVC5 高级编程>第5版 第5章 表单和HTML辅助方法 5.1 表单的使用 5.1.1 action 和 method 特性 默认情况下,表单发送的是 HTT ...

  5. ASP.NET MVC5 高级编程 第2章 控制器

    参考资料<ASP.NET MVC5 高级编程>第5版 第2章 控制器 控制器:响应用户的HTTP 请求,并将处理的信息返回给浏览器. 2.1 ASP.NET MVC 简介 MVC 模式中的 ...

  6. 《asp.net mvc3 高级编程》第四章 模型

    一,建立简单的Model 在Models文件夹上右击鼠标,选择“添加”,“类”,如下图所示: 建立三类相关联的类代码如下: public class Album { public virtual in ...

  7. UNIX环境高级编程-第三章习题

    1,当读写磁盘文件时,read,write等函数确实是不带缓冲机制的吗?请说明原因. 答:所有磁盘I/O都要经过内核的块缓存区(即内核的缓冲区高速缓存).唯一例外的是对原始磁盘设备的I/O,但是我们不 ...

  8. unix环境高级编程第三章笔记

    文件描述符 1.文件描述符的概念 对于内核而言,所有打开的文件都会用一个文件描述符来引用,打开或和创建一个新文件的时候,内核会给进程返回一个文件描述符,而当使用read write时,可以使用这个文件 ...

  9. 【读书笔记】C#高级编程 第三章 对象和类型

    (一)类和结构 类和结构实际上都是创建对象的模板,每个对象都包含数据,并提供了处理和访问数据的方法. 类和结构的区别:内存中的存储方式.访问方式(类是存储在堆上的引用类型,结构是存储在栈的值类型)和它 ...

随机推荐

  1. 【转】Java ConcurrentModificationException异常原因和解决方法

    原文网址:http://www.cnblogs.com/dolphin0520/p/3933551.html Java ConcurrentModificationException异常原因和解决方法 ...

  2. 数据结构(主席树):HDU 5654 xiaoxin and his watermelon candy

    Problem Description During his six grade summer vacation, xiaoxin got lots of watermelon candies fro ...

  3. 搜索与DP:SLIKAR

    Problem: SLIKAR[题目描述]Josip 是个奇怪的画家,他想画一幅由 N*N 个点组成的图, N 是一个 2 的乘方 数(1, 2, 4, 8, 16 等.).每个点要么是黑色的,要么是 ...

  4. bzoj3223 Tyvj 1729 文艺平衡树(Splay Tree+区间翻转)

    3223: Tyvj 1729 文艺平衡树 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 2202  Solved: 1226[Submit][Sta ...

  5. FZU 2113 Jason的特殊爱好

    题意: 给定区间[a,b],求将区间中所有数写在黑板上,要写的数字‘1’的次数.(1 <= a,b <= 10^8) 解法: 将题转化成f(b+1) - f(a)的形式.普通的数位DP. ...

  6. Jenkins 十一: 构建Maven项目

    1. 点击“新建”,在“Item名称”栏输入要构建的项目名,比如“Maven_project”,选择“构建一个maven项目”,点击“OK”按钮. 2. 找到“源码管理”-> “Subversi ...

  7. Linux 守护进程的启动方法

    守护进程”(daemon)就是一直在后台运行的进程(daemon). 本文介绍如何将一个 Web 应用,启动为守护进程. 一.问题的由来 Web应用写好后,下一件事就是启动,让它一直在后台运行. 这并 ...

  8. Apache-Tika解析Word文档

    通常在使用爬虫时,爬取到网上的文章都是各式各样的格式处理起来比较麻烦,这里我们使用Apache-Tika来处理Word格式的文章,如下: package com.mengyao.tika.app; i ...

  9. 第四篇:R语言数据可视化之折线图、堆积图、堆积面积图

    折线图简介 折线图通常用来对两个连续变量的依存关系进行可视化,其中横轴很多时候是时间轴. 但横轴也不一定是连续型变量,可以是有序的离散型变量. 绘制基本折线图 本例选用如下测试数据集: 绘制方法是首先 ...

  10. 初学coreData数据库读取不成功的问题

    写了一个从数据库读取数据显示列表的代码,结果却无法运行,提示找不到对应的entity,也就是数据库中的某一个表 我查遍了代码也没有发现什么逻辑错误,在appDelegate也初始化了相关数据库,在界面 ...