c# mvc5 view 多层_ASP.NET MVC5高级编程 之 视图

1.1理解视图约定

当创建一个项目模版时，可以注意到，项目以一种非常具体的方式包含了一个结构化的Views目录。在每一个控制器的View文件夹中，每一个操作方法都有一个同名的视图文件与其对应。这就提供了视图与操作方法关联的基础。

1 publicActionResult Index()2{3 returnView();4 }

视图选择逻辑在/Views/ControllerName目录(这里就是去掉Controller后缀的控制器名)下查找与操作方法同名的视图。此处选择的是/Views/Home/Index.cshtml。

与ASP.NET MVC中的大部分方法一样，这一约定是可以重写的。想让Index操作方法渲染一个不同的视图，可以向其提供一个不同的视图名称，代码如下：

1 publicActionResult Index()2{3 return View("NotIndex");4 }

对于上面的编码，操作方法依然在/Views/Home目录中查找视图，但选择的不再是Index.cshtml，而是NotIndex.cshtml。

如果需要制定完全位于不同目录结构中的视图，编码如下：

1 publicActionResult Index()2{3 return View("~/Views/Example/Index.cshtml");4 }

1.2 强类型视图

假设需要编写一个显示Album实例列表的视图，一种方法是将专辑添加到ViewBag中，然后在视图中进行迭代。

1 publicActionResult List()2 {3 var albums = new List();4 for (int i = 0; i < 10; i++)5 {6 albums.Add(new Album { Title = "Product" +i });7 }8 ViewBag.Albums =albums;9 returnView();10 }

然后，再在视图中迭代显示，如下代码：

1

2 @foreach (Album a in (ViewBag.Albums as IEnumerable))3 {4 @a.Tilte

5 }6

注意在枚举之前需要将动态的ViewBag.Albums转换为IEnumerable类型。为了使代码整洁，可以使用dynamic关键字，但是当访问每个Album对象的属性时，就不能再使用智能感知功能。

1

• 2 @foreach (dynamic p in ViewBag.Albums)

3 {

4

@p.Tilte5 }

6

强类型视图既能获得dynamic的简洁语法，又能获得强类型和编译时检查的好处(比如正确的输入属性和方法名称)。强类型视图允许设置视图的模型类型。因此可以从控制器向视图传递一个在两端都是强类型的模型对象，从而获得智能感知、编译器检查等好处。

在Controller方法中，可以通过向重载的View方法中传递模型实例来指定模型，代码如下：

1 publicActionResult List()2 {3 var Musics = new List();4 for (int i = 0; i < 10; i++)5 {6 Musics.Add(new MusicModels { MusicName = "MusicName" +i.ToString() });7 }8 returnView(Musics);9 }

下一步是告知视图哪种类型的模型正在使用@model声明。但要注意这里需要输入模型类型的完全限定类型名(名称空间和类型名称)，如下所示

1 @model IEnumerable

2

3 @foreach(MvcMusicStore.Models.MusicModels music in Model)4

@music.SingerName

5

如果不想输入模型类型的完全限定类型名，可使用@using关键字，如下所示

1 @using MvcMusicStore.Models2 @model IEnumerable

3

4 @foreach(MusicModels music in Model)5

@music.SingerName

6

对于在视图中经常使用的名称空间，好的方法是在Views目录下的web.config文件中声明：

1.3 理解ViewBag、ViewData和ViewDataDictionary

之前介绍了使用ViewBag从控制器向视图传递信息，然后介绍了传递强类型模型。现实中，这些都是通过ViewDataDictionary传递的。

从技术的角度看，数据从控制器传送到视图是通过一个名为ViewData的ViewDataDictionary(这是一个特殊的字典类)。我们可以使用标准的字典语法设置或读取其中的值：

ViewData["CurrentTime"] = DateTime.Now;

尽管这种语法现在也能用，但是MVC3提供了更简单的语法，可以利用C#4的dynamic关键字。ViewBag是ViewData的动态封装器。这样我们就可以按照下面的方式来设置值：

ViewBag.CurrentTime = DateTime.Now;

ViewBag.CurrentTime和ViewData["CurrentTime"] 起到了等同的作用。

一般来说，大部分代码使用ViewBag，而不是ViewData，这两种语法并不存在技术上的差异，仅仅是因为ViewBag相对于字典语法而言看上去好看。

注意，ViewBag和ViewData的差异：

只有当要访问的关键字是一个有效的C#标识符时，ViewBag才起作用。例如，如果在ViewData["Key With Spaces"]中存放一个值，那么就不用使用ViewBag访问，因为无法通过编译。

动态值不能作为一个参数传递给扩展方法，因为C#编译器为了选择正确的扩展方法，在编译时必须知道每一个参数的真正类型。

2.视图模型

在操作方法上右击 --> “添加视图”

弹出添加视图页：

View name：当从一个操作方法的上下文中打开这个对话框时，视图的名称默认被填充为操作方法的名称。视图的名称是必须有的。

Template：一旦选择一个模型类型，就可以选择一个基架模版。这些模版利用Visual Studio模版系统来生成基于选择模型类型的视图。

引用脚本库：这个选项用来指示要创建的视图是否应该包含指向JavaScript库(如果对视图有意义的话)的引用。默认情况下，_Layout.cshtml文件既不引用jQuery Validation库，也不引用Unobtrusive jQuery Validation库，只引用主jQuery库。

当创建一个包含数据条目表单的视图(如Edit视图或者Create视图)时，选择这个选项会添加对jqueryval捆绑的脚本引用。如果要实现客户端验证，那么这些库就是必须的。除这种情况外，完全可以忽略这个复选框。

创建一个分部视图：选择这个意味着要创建的视图不是一个完整的视图，因此，Layout选项是不可选用的。生成的部分视图除了在其顶部没有标签和

标签外，很像一个常规的视图。

使用布局页：这个选项决定了要创建的视图是否引用布局，还是成为一个完全独立的视图。如果选择使用默认的布局，就没必要指定一个布局了，因为在_ViewStart.cshtml文件中已经指定了布局。这个选项是用来重写默认布局文件的。

2.2 Razor视图引擎

ASP.NET MVC中提供了两种不同的视图引擎：较新的Razor视图引擎和较早的WebForms视图引擎。

Razor中的核心转换字符是(@)，这个单一字符用作标记-代码的转换字符，有时也反过来用作代码-标记的转换字符。

这里一共有两种基本类型的转换：代码表达式和代码快。

Listing @items.Length items.

表达式@items.Length是作为隐式表达式来求解的，然后输出表达式的值3。这里不需要指出代码表达式的结束位置。

但是Razor自动从代码转回标记的能力，也带来了二义性的问题：

1 @{2 string rootNamespace = "MyApp";3 }4 @rootNamespace.Models

这个示例想要的输出结果是：  MyApp.Models  ，然而实际会出现错误，提示string没有Models属性，此时需要通过圆括号解决：

1 @{

2 string rootNamespace = "MyApp";

3 }

4@(rootNamespace).Models

这样可以告诉Razor，.Models是字面量文本，而不是代码表达式的一部分。

对于电子邮件地址时的情况,Razor可以辨别出邮件的模式，进而不处理这种形式的表达式：

support@megacorp.com

但是如果确实想将这种形式的字符串作为一个表达式，也需要合理用圆括号：

对于

Item_@item.Length

期望的输出结果是

Item_3，但是Razor会将其按照字符串进行打印。

处理的方法是：

Item_@(item.Length)

有时也需要使用@符号来进行转义：

1

2 You should follow3 @@aspnet4

3.Razor语法示例

常见用途下的Razor语法;

隐式代码表达式

代码表达式将被计算并将值写入到响应中，这就是视图中显示值的一般原理。

@model.Message

显示代码表达式

代码表达式的值将被计算并写入到响应中，这就是在视图中显示值的一般原理

1 + 2 = @(1 +2 )

无编码代码表达式

有些情况下，需要显式的渲染一些不应该采用HTML编码的值，这时可以采用Html.Raw方法来保证该值不被编码

@Html.Raw(model.Message)

代码块

不像代码表达式先求的表达式的值，然后再输出到响应，代码块是简单地执行代码部分

1@{2 int x = 123;3 string y = "because."

4 }

文本和标记相结合

这个例子显示了在Razor中混用文本和标记的概念，具体如下：

1 @foreach (var item in items)2 {3 Item@item.Name.

4 }

混合代码和纯文本

Razor查找标签的开始位置以确定何时将代码转换为标记。然而，有时可能想在一个代码块之后立即输出纯文本。例如，在下面的这个例子中就是展示如何在一个条件语句块中显示纯文本

1 @if (showMessage)2 {3 this is plain text

4 }

或者

1 @if (showMessage)2 {3 @:this is plain text.4 }

第一种使用标签，这样只是把标签内容写入到响应中，而标签本身则不写入。第二种方式使用一种特殊的语法，实现代码到纯文本的转换，但是这种方法每次只能作用于一行文本。

转义代码分隔符

可使用“@@”来编码“@”以达到显示“@”的目的。此外，时钟都可以选择使用HTML编码来实现。

Razor：

the asp.net twitter handle is @aspnet

或者

the asp.net twitter handle is @@aspnet

代码注释

1 @*2 代码块3 *@

4.布局

Razor的布局有助于使应用程序的多个视图保持一致的外观。可以使用布局为网站定义公共模版(或只是其中的一部分)。公公模版包含一个或多个占位符，应用程序中的其他视图为它们提供内容。从某些角度看，布局很像视图的抽象基类。如下则是一个简单的布局：

1

2

3

4

@ViewBag.Title

5

6

7

@ViewBag.Title

8 @RenderBody()