【MVC】View的使用
/Views/_ViewStart.cshtml 文件会在其他视图文档被加载之前被载入,代码如下:
- @{
- Layout = "~/Views/Shared/_Layout.cshtml";
- }
标志主板页为_Layout.cshtml。_ViewStart.cshtml文件同样可以出现在Views子目录下,实现不同的控制器下预设载入不同的主版页面。_Layout.cshtml代码结构:

- <header>
- <div>...</div>
- </header>
- <div id="body">
- @RenderSection("featured", required: false)
- <section class="content-wrapper main-content clear-fix">
- @RenderBody()
- </section>
- </div>
- <footer>
- <div>...</div>
- </footer>

注意代码中的@RenderSection和@RenderBody,@RenderBody在Razor主版页面中可以视为“预设坑洞”,也就是说View视图会被填入到@RenderBody的位置。
@RenderSection在Razor主版页面中可以被视为“具名坑洞”,如果把required具名参数指定为true的话,那么所有载入这个主版页面的View页面都必须在@RenderSection中输出相应的内容,否则将产生异常。而“featured”就是坑洞的名字,因为required为false,所以不必填充该具名坑洞。MVC模板项目中Index.cshtml是这样填充的,如下:

- @section featured {
- <section class="featured">
- <div class="content-wrapper">
- <hgroup class="title">
- <h1>@ViewBag.Title.</h1>
- <h2>@ViewBag.Message</h2>
- </hgroup>
- <p>
- To learn more about ASP.NET MVC visit
- <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
- The page features <mark>videos, tutorials, and samples</mark> to help you get the most from ASP.NET MVC.
- If you have any questions about ASP.NET MVC visit
- <a href="http://forums.asp.net/1146.aspx/1?MVC" title="ASP.NET MVC Forum">our forums</a>.
- </p>
- </div>
- </section>
- }

Razor页面有固定的执行顺序,先执行View在执行Layout主版页面,因为View与Layout公用一个ViewDataDictionary实体,因此可以通过ViewBag将数据从View传递到Layout页面中,但反过来并不成立。
2,@helper辅助方法
将View页面中的部分内容或部分代码抽取出来,变成一个独立的辅助方法。{不要重复你自己的原则},示例代码如下:

- <table>
- @foreach (var item in Model)
- {
- <tr>
- <td>
- @GenerateStr(item.ID)
- </td>
- <td>
- @item.Name
- </td>
- </tr>
- }
- </table>
- @helper GenerateStr(int id)
- {
- <text>NO</text>@id
- }

声明@Helper辅助方法与C#中声明方法的方法非常类似,差别就是不用回传任何类型。
如果要将这个@helper辅助方法用在多个不同的View里,可以将@helper辅助方法独立出来,放置在根目录App_Code中。
注:添加App_Code文件夹的方式也很讲究,在项目中右键-->添加Asp.Net文件夹-->选择App_Code即可。然后在该文件夹中添加布局文件(cshtml){以习惯取代配置}
然后将之前编写的@helper方法拷贝进来就可以了。假如说添加了UIHelper.cshtml,并声明了GenerateStr(int ID)方法,那么会声明一个UIHelper类,调用方式如下:
@UIHelper.GenerateStr(item.ID)
@helper辅助方法的缺陷:@helper辅助方法只能够简单的传入参数,格式化成想要的样式输出,为此Razor提供了@functions自定义函数功能。
先通过@functions定义一个代码区域,然后把C#代码写在里面,如果方法将执行的结果返回给View页面,则必须以IHtmlString类型返回。示例:

- @functions{
- public IHtmlString GetYesterday()
- {
- var theDay = DateTime.Now.AddDays(-);
- return new HtmlString(theDay.ToShortDateString());
- }
- }

同样@functions方法可以用于多个不同的View中共享。不过需要注意,此时应该把@functions中的方法设置为static{静态方法的使用方式}
3,@using引入命名空间:
- @using HelloMVC_2.Models
- @model IEnumerable<HelperTestModel >
注意:在Views目录中存在web.config文件,<namespaces>区段设置所有View页面都会引入的命名空间,可以将常用的命名空间添加到这里,如下:

- <namespaces>
- <add namespace="System.Web.Mvc" />
- <add namespace="System.Web.Mvc.Ajax" />
- <add namespace="System.Web.Mvc.Html" />
- <add namespace="System.Web.Optimization"/>
- <add namespace="System.Web.Routing" />
- </namespaces>

4,View如何从Action取得数据
使用弱类型取得数据/使用强类型取得数据。前者使用ViewData、ViewBag或TempData,也可以通过@Model属性,但Model属性的类型为object,所以是弱型别。
强型别的方式从Controller中取得数据,在View用@model声明专用类型 如:@model Namespace.MyModel,使用强型别类型的一个好处是,可以使用VS的智能提示的功能。
用ViewData.Model传递数据的示例代码如下:

- public ActionResult Test()
- {
- List<HelperTestModel> list = new List<HelperTestModel>()
- {
- new HelperTestModel(){ID=,Name="Bill"},
- new HelperTestModel(){ID=,Name="Paul"}
- };
- ViewData.Model = list;
- return View();
- }
- @using HelloMVC_2.Models
- @{var temp = (System.Collections.Generic.IEnumerable<HelperTestModel>)Model;}
- @foreach(var item in temp)
- {
- <li>@item.ID</li>
- }

注意到使用弱类型传递至View,改用强型别操作时,需要强制类型转换。注意@using 引入命名空间的使用。
5,@HTML辅助方法
以@Html.DropDownList()为例,代码如下:

- //Controller中代码示例
- List<HelperTestModel> list = new List<HelperTestModel>()
- {
- new HelperTestModel(){ID=,Name="Bill"},
- new HelperTestModel(){ID=,Name="Paul"}
- };
- //ViewData.Model = list;
- ViewData["List"] = new SelectList(list, "ID", "Name");
- return View();
- //View中代码示例
- @Html.DropDownList("List",ViewData["List"] as SelectList)

其中SelectList,是专门提供给项目列表有关的数据类型,如Html.DropDownList()和Html.ListBox()
强类型的辅助方法:在原有名称上加上For,比如:Html.LabelFor();必须用@model定义View页面的参考数据模型。示例代码如下:

- //Model中
- public class Product
- {
- public int Id { get; set; }
- [Required]
- [DisplayName("产品名称")]
- public string Name { get; set; }
- [Required]
- [DisplayName("产品说明")]
- public string Description { get; set; }
- [Required]
- public int UnitPrice { get; set; }
- }
- //View中
- @model HelloMVC_2.Models.Product
- @using (Html.BeginForm())
- {
- @Html.ValidationSummary(true)
- <fieldset>
- <legend>产品资讯</legend>
- <div class="editor-label">
- @Html.LabelFor(model=>model.Name)
- </div>
- <div class="efitor-field">
- @Html.TextAreaFor(model=>model.Name)
- @Html.ValidationMessageFor(model=>model.Name)
- </div>
- <div class="editor-label">
- @Html.LabelFor(model=>model.Description)
- </div>
- <div class="efitor-field">
- @Html.TextAreaFor(model=>model.Description)
- @Html.ValidationMessageFor(model=>model.Description)
- </div>
- <p>
- <input type="submit" />
- </p>
- </fieldset>
- }

效果如图所示:
通过上面的例子,很容易的实现了关注点分离。
6,使用分部视图
在ASP.NET Web Form的开发经验中,对于User Control使用比较频繁,可以减少重复的代码{不要重复你自己的原则},利于页面模块化,这个概念也被引入了ASP.NET MVC.即“分部视图”。
分部视图把部分HTML或逻辑包装起来,方便重复引用,把分部视图放置与Views\Shared目录时,供其他的View载入。
创建部分视图与创建普通的视图的的方式一致,特别的是需要选中“创建分部视图”复选框,并放在Shared目录下。默认情况下分部视图*.cshtml为空文档。
使用分部视图时,不需要建立相关的Action。因为分部视图是片段的,必须要选择一个完整的页面来载入。用@Html.Partial()方法。
在一个视图页面中,如果载入了多个分部视图,每个分部视图均可以取到原页面的ViewData\TempData\Model等数据,也就是说数据可以在各分部视图之间公用。
分部视图除了可以直接从检视页面载入外,也可以像一般检视页面一样从Controller中使用。示例代码如下:

- //控制器中示例代码
- public ActionResult Test()
- {
- return PartialView();
- }
- //然后创建Test的分部视图,简单起见只输入一行文本
- 我的博客是SharpL
- //最后在视图页面中,通过Html.Action载入TestAction的执行结果
- @Html.Action("Test")

通过Html.Action与Html.Partial载入分部视图的结果是一致的,但是过程不同,Html.Action会重新执行一遍Controller的声明周期。
7,MVC支持两种不同的“视图模板”:分别是显示模板和编辑器模板。
以@Html.EditorFor(m=>m.UserName)来说,@Html.EditorFor模板会依据UserName的类型以及属性(比如[DataType(DataType.Password)])来找出合适的模板,UserName的数据类型为String,因此模板名称也将为String,MVC 4中内建的编辑器模板中包括String,所以模板辅助方法会挑出String这个视图模板来执行。因为模板辅助方法在判断模板名称时,除了判断型别名称外,还会判断其属性,以Password来说,最终将会选择Password模板来执行。
- [Required]
- [DataType(DataType.Password)]
- [Display(Name = "密码")]
- public string Password { get; set; }
MVC4中内建了10个显示模板,其中包括EmailAddress等。

- [Required]
- [MaxLength()]
- [DisplayName("会员电子邮箱")]
- [DataType(DataType.EmailAddress)]
- public string Email { get; set; }
- /* 注意Email上的DataType属性 */
- <div class="display-field">
- @Html.DisplayFor(m=>m.Email)
- </div>

EmailAddress将输出超链接,网页的HTML源码码如下:
- <div class="display-field">
- <a href="mailto:SharpL@qq.com">SharpL@qq.com</a>
- </div>
8,自定义视图模板
约定如下:
视图模板一定要放在指定的几个规定目录下{以约定代替配置原则},显示模板路径:
/Views/ControllerName/DisplayTemplates或者/Views/Shared/DisplayTemplates目录下。
编辑器模板位于:
/Views/ControllerName/EditorTemplates或者/Views/Shared/EditorTemplates目录下。
文档名称必须等于类型名称。文档的后缀名可以是.cshtml/.vbhtml/.aspx/.ascx。先插入一段代码,如下:
- [NotMapped]
- [UIHint("Gravatar")]
- [DisplayName("会员Gravatar照片")]
- public string Gravatar { get; set; }
[NotMapped]属性指不需要建立在数据库中,而UIHint属性指为Gravator添加自定义模板,且模板名称为”Gravatar“。
于是我们在/Views/Shared/DisplayTemplates文件夹下新建一个”Gravatar.cshtml"文档,不需要强类型。将该视图中的@model定义为string,是由其上一级视图传递进来的,代码如下:
- @model System.String
- @{
- var temp = "算你狠" + Model;
- }
- <h2>@temp</h2>
效果如下:
自定义编辑器模板与自定义显示模板的方式一致,只是约定的路径不同,示例代码如下:

- [Required]
- [UIHint("DateTime")]
- [DisplayName("创建会员的日期")]
- public DateTime CreateOn { get; set; }
- /*注意是EditorFor,如果是LabelFor无效,因为我们修改的是编辑器模板
- <div class="display-field">
- @Html.EditorFor(m=>m.CreateOn)
- </div>
- /*编辑器模板*/
- @model System.DateTime
- @Html.TextBox("",Model.ToString("yyyy/MM/dd"))

9,选用视图模板的判断顺序:
UIHint属性优先级最高,属于自定义模板,其次是DataType,是字段的属性,最后是字段的类型。
10,@Html.DisplayForModel()
该辅助器方法不用传入任何参数,每条属性会挑选出适当的试图模板来输出
11,自定义Html辅助方法
也就是给HtmlHrlper类添加拓展方法,将方法定义在抽象类的抽象方法中。

- public static class ImageHelpers
- {
- /// <summary>
- /// 实际上就是创建一个HtmlHelper类的拓展方法
- /// </summary>
- /// <param name="helper">要被拓展的类</param>
- /// <param name="url">图片网址啊</param>
- /// <param name="alternateText">说明文字</param>
- /// <param name="title">标题文字</param>
- /// <returns></returns>
- public static MvcHtmlString Img(this HtmlHelper helper,string url,string alternateText,string title)
- {
- return MvcHtmlString.Create(string.Format("<img src='{0}' alt='{1}' title='{2}'/>", url, alternateText, title));
- }
- }

可以以StringBuilder组字串的方式,来写Html标签,也可以用TagBuilder来写,不做详细的说明,可以参考ASP.NET MVC4开发指南中7.4.5章节的介绍。
12,Url辅助方法
@url.Action("ActionName") 最后输出结果为 /ControllerName/ActionName
同时@url.RouteUrl(new {name="SharpL"})
还有@Url.Encode("str")等等。
@Url.Content("~/images/Logo.png") 取得网站中静态文档的网址路径。
出处:http://www.cnblogs.com/SharpL/p/4596044.html
【MVC】View的使用的更多相关文章
- ASP.NET MVC View 和 Web API 的基本权限验证
ASP.NET MVC 5.0已经发布一段时间了,适应了一段时间,准备把原来的MVC项目重构了一遍,先把基本权限验证这块记录一下. 环境:Windows 7 Professional SP1 + Mi ...
- 【记录】ASP.NET MVC View 移动版浏览的奇怪问题
ASP.NET MVC View 中的一段代码: <span id="span_Id">@Model.ID</span> 没什么问题吧,浏览器浏览正常,查看 ...
- ASP.Net MVC View
ASP.Net MVC View(视图) View视图职责是向用户提供界面.负责根据提供的模型数据,生成准备提供给用户的格式界面. 支持多种视图引擎(Razor和ASPX视图引擎是官方默认给出的, ...
- C# -- 等待异步操作执行完成的方式 C# -- 使用委托 delegate 执行异步操作 JavaScript -- 原型:prototype的使用 DBHelper类连接数据库 MVC View中获取action、controller、area名称、参数
C# -- 等待异步操作执行完成的方式 C# -- 等待异步操作执行完成的方式 1. 等待异步操作的完成,代码实现: class Program { static void Main(string[] ...
- ZendFramework-2.4 源代码 - 关于MVC - View层 - 控制器返回值
<?php class ReturnController extends AbstractActionController { public function returnAction() { ...
- 多表的时候怎样在MVC VIEW中显示
原文发布时间为:2011-04-01 -- 来源于本人的百度文章 [由搬家工具导入] Linq join query displayed in MVC view Instead of returnin ...
- Cannot resolve MVC View
在搭建springboot项目时报错:Cannot resolve MVC View "index" 那是因为在pom中缺少依赖 <dependency> <gr ...
- MVC View基础
View主要用于呈现数据.由于Controller和相关的Service已经处理完业务逻辑并将结果打包成model实体,View只需要怎么去获得model并将其转为Html 1选择需要渲染的视图 在上 ...
- MVC View基础(转)
View主要用于呈现数据.由于Controller和相关的Service已经处理完业务逻辑并将结果打包成model实体,View只需要怎么去获得model并将其转为Html 1选择需要渲染的视图 在上 ...
- ASP.NET MVC View向Controller传值方式总结
1:QueryString传值1)也可以使用new{}来为form的action增加querystring2)在controler里使用Request.QueryString["word&q ...
随机推荐
- python-day34--并发编程之多线程
理论部分 一.什么是线程: 1.线程:一条流水线的工作过程 2.一个进程里至少有一个线程,这个线程叫主线程 进程里真正干活的就是线程 3.进程只是用来把资源集中到一起(进程只是一个资源单位,或者说资 ...
- 使用dbms_output.put_line打印异常所在的行
dbms_output.put_line(dbms_utility.format_error_stack); dbms_output.put_line(dbms_utility.format_call ...
- h5请求跨域问题Access-Control-Allow-Origin解决跨域
访问后端接口报错:No 'Access-Control-Allow-Origin' header is present on the requested resource 解决: Access-Con ...
- 使用 PM2 管理nodejs进程
pm2 是一个带有负载均衡功能的Node应用的进程管理器. 当你要把你的独立代码利用全部的服务器上的所有CPU,并保证进程永远都活着,0秒的重载, PM2是完美的. 它非常适合IaaS结构,但不要把它 ...
- SSH执行远程命令和传送数据
$ ssh user@host 'mkdir -p .ssh && cat >> .ssh/authorized_keys' < ~/.ssh/id_rsa.pub ...
- 杜伦大学提出GANomaly:无需负例样本实现异常检测
杜伦大学提出GANomaly:无需负例样本实现异常检测 本期推荐的论文笔记来自 PaperWeekly 社区用户 @TwistedW.在异常检测模块下,如果没有异常(负例样本)来训练模型,应该如何实现 ...
- vue-cli的安装及使用
一. node 和npm 1.在安装vue-cli前,要确认自己的电脑是否安装了node和npm 2.查询版本如下(vue脚手架支持node@4.xx以上) node -v 查询node版 ...
- Oracle连接知识
Oracle基本连接知识 登录sys用户或 sysdba用户权限的账号 Sqlplus 建用户 Create user test identified by 12345678 ...
- 对va_list; va_start ; va_end ;vsprintf理解(转)
以下为转载内容: int printf(const char* fmt, ...) { va_list args; int i; //1.将变参转化为字符串 va_start(args,fmt); v ...
- 015PHP文件处理——文件处理flock 文件锁定 pathinfo realpath tmpfile tempname
<?php /**文件处理flock 文件锁定 pathinfo realpath tmpfile tempname */ /*$arr=pathinfo('ab.txt');//获取文件路径的 ...