MVC View基础(转)

时间:2023-03-08 15:40:11
MVC View基础(转)

View主要用于呈现数据。由于Controller和相关的Service已经处理完业务逻辑并将结果打包成model实体,View只需要怎么去获得model并将其转为Html

1选择需要渲染的视图

在上一篇中GuestbookController:

public ActionResult Create()
{
       return View();
}

默认渲染的是Views/Guestbook/Create.cshtml. 当以无参形式调用View()时, Framework推断要渲染的视图的名称应该和Action的名称一致。然后在MVC管线中,ControllerActionInvoker执行ViewResult并且告知要渲染的View,同时Framework请求ViewEngineCollection去定位要渲染的View(默认情况下,先寻找Views/<Controller Name>目录,然后是Views/Shared 目录)

2View重写

指定视图名称来返回视图

public ActionResult TestJson() {
return View();
}
public ActionResult TestJsonContent() {
return View("TestJson");
}

甚至还可以指定视图的路径

return View("~/Views/SomeOtherDirectory/New.cshtml");

3传递数据给View

在MVC中,Model对象是指包含了数据的模型. Controller将Model传递给View以后, View对象中不应该做任何的业务逻辑处理, 仅仅根据Model对象做一些显示逻辑的处理.

传递Model对象时, 我们有两种选择:

1.传递一个弱类型的集合, 即成员为object类型的集合,  在View中需要将每个成员转换成我们需要的类型,比如int, string,自定义类型等.

2.传递强类型对象, 这些类型是我们自定义的. 在View中直接使用我们传递的强类型对象, 不需要再转换类型.

 

传递弱类型:

ASP.NET MVC框架定义了ViewContext类, 直译后是"View上下文", 其中保存和View有关的所有数据, 其中Model对象也封装在了此类型中.

MVC View基础(转)

ViewData集合和TempData集合都是用来保存Model对象的.在一个Controller的Action中, 我们可以用如下方式为这两个集合赋值:

public ActionResult <span style="color: #000000;">Create</span>()
 {
     ViewData["hasPermission"] = true;
     TempData["hasPermission"] = true;
     return View();
 }

在页面中, 使用如下方式使用这两个集合:@{bool hasPermission=(bool)ViewData["hasPermission"]}   @{bool hasPermission=(bool)TempData["hasPermission"]}

自MVC 3开始有一个新的ViewBag 动态特性,它主要是为了从Controller到view进行传值用的,类似有所使用的ViewData[] 字典类。它定义为Dynamic,意味着你能动态的set/get  值,增加任何数量的的额外字段而不需要强类型的检测。

        public ActionResult Create()
{
ViewBag.hasPermission = true;
return View();
}

在页面中, 使用如下方式@{bool hasPermission=(bool)ViewBag.hasPermission}

强类型

当使用基于Razor的视图时,视图默认继承两个类型:System.Web.Mvc.WebViewPage或者 System.Web.Mvc.WebViewPage<T>。泛型WebViewPage<T>继承自 WebViewPage,但是提供了一些非泛型WebViewPage类里没有的独特的补充。

下面展示了WebViewPage<T>的主干成员定义:

public class WebViewPage<TModel> : WebViewPage
{
public new AjaxHelper<TModel> Ajax { get; set; }
public new HtmlHelper<TModel> Html { get; set; }
public new TModel Model { get; }
public new ViewDataDictionary<TModel> ViewData { get; set; }
}

要使用强类型视图,首先你必须确保控制器动作正确设置了ViewData.Model。在清单3.4里,我们获取所有的留言记录,显示在列表页面,并传递个人档案的整个集合到View方法,此方法封装了对ViewData.Model属性的设置。

MVC View基础(转)
public ActionResult Index()
{
var mostRecentEntries = (from entry in _db.Entries
orderby entry.DateAdded descending
select entry).Take(20);
var model = mostRecentEntries.ToList();
return View(model);
}
MVC View基础(转)

在与这个动作相应的Index视图里,即使松散类型的WebViewPage类也能使用ViewData.Model属性。但是这个属性只是一个object类型,我们需要对它进行转换以便有效地使用它。作为替代方案,我们能用@model关键词指定模型的类型。

@using Guestbook.Models
@model List<GuestbookEntry>

ASP.NET MVC 3 Beta版中添加新@model指令以提供一个更干净简洁的方式来指明你想要在视图文件中引用强类型模型类。你现在只需在你的Razor视图文件的顶端写 上@model StrongModelType就行了, 再无需有一个@inherits或指定一个视图基类

例如:

@model MvcApplication5.Models.GuestbookEntry

@model IEnumerable<MvcApplication5.Models.GuestbookEntry>

转换为强类型后,要显示响应的数据是那么的简单,如:@Model.Message

4视图模板的选择

MVC提供了两种视图:Aspx, Razor:

使用.ASPX“代码碎块”的方式编写

我们需要在HTML标签中使用”<%= %>”来标记“代码碎块”:

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<DemoRC.Models.DTO.TransferModelController.StrongTypedDemoDTO>" %>
...
<body>
    <fieldset>
        <legend>Fields</legend>
        <p>
            UserName:
            <%= Html.Encode(Model.UserName) %>
        </p>
        <p>
            UserPassword:
            <%= Html.Encode(Model.UserPassword) %>
        </p>
    </fieldset>
    <p>
        <%=Html.ActionLink("Edit", "Edit", new { /* id=Model.PrimaryKey */ }) %> |
        <%=Html.ActionLink("Back to List", "Index") %>
    </p>
</body>

仔细观察就可以发现上例中每一个代码碎块都需要5个字符(”<%= %>”)来标明代码的开始和结束位置。

使用Razor的语法编写

在Razor中,你只需要用一个”@”字符就可以标识代码块的开始,与”<% %>”代码碎块不一样,Razor不需要你显式指明代码块的结束位置:

<ol>
     <li>
         @Html.LabelFor(m => m.UserName)
         @Html.TextBoxFor(m => m.UserName)
     </li>
     <li>
         @Html.LabelFor(m => m.Password)
         @Html.PasswordFor(m => m.Password)
     </li>
     <li>
         @Html.CheckBoxFor(m => m.RememberMe)
         @Html.LabelFor(m => m.RememberMe, new { @class = "checkbox" })
     </li>
 </ol>

个人比较喜欢Razor,点击查看更多Razor介绍