您的位置：首页 > 编程语言 > ASP

ASP.NET MVC 3.0 新特性之View

2011-07-27 20:25 369 查看

ASP.NET MVC 3.0 新特性之View

asp.net mvc 之 asp.net mvc 3.0 新特性之 View(Razor)：

Razor 的语法

Razor 与 Model

Razor 与布局

示例
1、Razor 概述
RazorDemoController.cs

using
System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Web;
using
System.Web.Mvc;
using
MVC30.Models;
namespace
MVC30.Controllers
{
public
 
class
 
RazorDemoController : Controller
{
public
 
ActionResult Summary()
{
return
 
View();
}
}
}
Summary.cshtml

@{
ViewBag.Title = "Razor 概述";
}
<
p
>
使用 Razor 之前，要在 Web.Config 中做如下配置
<
br
 
/>
<
textarea
 
rows
=
"20"
 
style
=
"width: 100%"
>
<
configSections
>
<
sectionGroup
 
name
=
"system.web.webPages.razor"
 
type
=
"System.Web.WebPages.Razor.Configuration.RazorWebSectionGroup, System.Web.WebPages.Razor, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"
>
<
section
 
name
=
"host"
 
type
=
"System.Web.WebPages.Razor.Configuration.HostSection, System.Web.WebPages.Razor, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"
 
requirePermission
=
"false"
 
/>
<
section
 
name
=
"pages"
 
type
=
"System.Web.WebPages.Razor.Configuration.RazorPagesSection, System.Web.WebPages.Razor, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"
 
requirePermission
=
"false"
 
/>
</
sectionGroup
>
</
configSections
>
<
system.web.webPages.razor
>
<
host
 
factoryType
=
"System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"
 
/>
<
pages
 
pageBaseType
=
"System.Web.Mvc.WebViewPage"
>
<
namespaces
>
<
add
 
namespace
=
"System.Web.Mvc"
 
/>
<
add
 
namespace
=
"System.Web.Mvc.Ajax"
 
/>
<
add
 
namespace
=
"System.Web.Mvc.Html"
 
/>
<
add
 
namespace
=
"System.Web.Routing"
 
/>
</
namespaces
>
</
pages
>
</
system.web.webPages.razor
>
</
textarea
>
</
p
>
<
p
>
View 在每次 Render 之前都会先执行 _ViewStart.cshtml 中的代码
</
p
>
2、Razor 语法简介
RazorDemoController.cs

using
 
System;
using
 
System.Collections.Generic;
using
 
System.Linq;
using
 
System.Web;
using
 
System.Web.Mvc;
using
 
MVC30.Models;
namespace
 
MVC30.Controllers
{
public
 
class
 
RazorDemoController : Controller
{
public
 
ActionResult Syntax()
{
return
 
View();
}
}
}
Syntax.cshtml

@{
ViewBag.Title = "Razor 语法";
}
<
p
>
使用@符号加{}，直接在 html 页面中写 C#
<
br
 
/>
@{ var currentTime = DateTime.Now;} @* 相当于 <% Htmlvar currentTime = DateTime.Now;%>*@
@currentTime.ToString("yyyy-MM-dd")
</
p
>
<
p
>
使用@符号，直接在 html 页面中写 C# 并输出结果
<
br
 
/>
当前 URL：
@Request.Url @* 相当于 <%= Request.Url %>*@
<
br
 
/>
当前 URL：
@{
@Request.Url;
}
</
p
>
<
p
>
想输出字符@怎么办？，那就@@
<
br
 
/>
webabcd@@abc.com
</
p
>
<
p
>
在 Razor 中写服务端注释（客户端不可见）
@* code *@
</
p
>
<
p
>
Razor 自带的类型转换方法
<
br
 
/>
例：AsInt(), IsInt(), AsBool(), IsBool(), AsFloat(), IsFloat(), AsDecimal(), IsDecimal(), AsDateTime(), IsDateTime()
<
br
 
/>
类似 AsInt() 的方法会有一个重载方法 AsInt(int defaultValue)，用于当转换失败时返回指定的默认值
@{
var tmp = "2/14/1980";
var date = tmp.AsDateTime();
}
@date.ToString("yyyy-MM-dd")
</
p
>
<
p
>
输出文本的方法
<
br
 
/>
@*
<
text
></
text
>
或者
@:
*@
@{
<
text
>我是文本</
text
>
<
br
 
/>
@:我是文本
}
</
p
>
<
p
>
获取文件的 URL 绝对路径的方法，一般用于 img 标签，link 标签，a 标签中所引用的文件的完全 url 路径
<
br
 
/>
<
img
 
alt
=
""
 
src
=
"@Href("
~/Content/themes/base/images/ui-icons_888888_256x240.png")" />
</
p
>
<
p
>
Html Helper, Ajax Helper, Url Helper 依然可以使用
<
br
 
/>
@Html.TextBox("txt", "我是 TextBox")
</
p
>
3、Razor 的与 Model 相关的 Demo
User.cs

using
 
System;
using
 
System.Collections.Generic;
using
 
System.Linq;
using
 
System.Web;
namespace
 
MVC30.Models
{
public
 
class
 
User
{
public
 
int
 
ID {
get
;
set
;}
 
public
 
string
 
Name {
get
;
set
;}
public
 
string
 
Password {
get
;
set
;}
public
 
string
 
ConfirmPassword {
get
;
set
;}
public
 
DateTime DateOfBirth {
get
;
set
;}
public
 
string
 
Comment {
get
;
set
;}
}
}
RazorDemoController.cs

using
 
System;
using
 
System.Collections.Generic;
using
 
System.Linq;
using
 
System.Web;
using
 
System.Web.Mvc;
using
 
MVC30.Models;
namespace
 
MVC30.Controllers
{
public
 
class
 
RazorDemoController : Controller
{
// 用于演示 View 如何获取数据
public
 
ActionResult Model()
{
// ViewBag 的本质就是把 ViewData 包装成为 dynamic 类型
ViewBag.Author =
"webabcd"
;
var list =
new
 
List<User>()
{
new
 
User { ID = 1, Name =
"webabcd"
, DateOfBirth =
new
 
DateTime(1980, 2, 14), Comment =
"<b>mvp</b>"
 
},
new
 
User { ID = 2, Name =
"prettygyy"
, DateOfBirth =
new
 
DateTime(1981, 6, 26), Comment =
"<b>mvp</b>"
 
}
};
return
 
View(list);
}
}
}
_MyLayout_ParitalView.cshtml

@*
通过 @model 指定 Model 的类型，同时 Model 对象就是 Html.Partial() 或 Html.RenderPartial() 时传递过来的对象
*@
@using MVC30.Models;
@model User
 
 
<
li
>@Model.Name</
li
>
Model.cshtml

@*
通过 @using 引入命名空间
通过 @model 指定 Model 的类型，同时 Model 对象就是 Action 返回的数据
*@
@using MVC30.Models;
@model List<
User
>
@{
ViewBag.Title = "Razor 的与 Model 相关的 Demo";
}
<
p
>
<!--
演示 ViewBag 的用法
-->
Author: @ViewBag.Author
</
p
>
<
div
>
<
ul
>
<!--
Model 就是 Action 返回的数据
-->
@foreach (var user in Model)
{
if (@user.Name == "webabcd")
{
<!--
默认输出的是经过 HTML 编码后的数据，如果需要输出原始数据则使用 Html.Raw()
-->
<
li
>@user.Name (@Html.Raw(@user.Comment))</
li
>
}
else
{
<
li
>@user.Name (@user.Comment)</
li
>
}
}
</
ul
>
</
div
>
<!--
Html.Partial 与 Html.RenderPartial 的区别：
Html.Partial - 直接将 View 的结果作为一个字符串输出
Html.RenderPartial - 将 View 作为一个用户控件嵌入到当前的 HttpContext 中
Html.Action 与 Html.RenderAction 的区别（演示参见 ControllerDemo/ChildActionOnlyDemo.cshtml）：
Html.Action - 直接将 Action 的结果作为一个字符串输出
Html.RenderAction - 将 Action 作为一个用户控件嵌入到当前的 HttpContext 中
Html.Partial, Html.RenderPartial 与 Html.Action, Html.RenderAction 的区别：
二者都需要指定 View，前者的 View 不需要 Action，而后者的 View 必须要有 Action
-->
<
div
>
<
ul
>
@foreach (var user in Model)
{
@Html.Partial("_MyLayout_ParitalView", user)
@*
<%= Html.Partial("_MyLayout_ParitalView", user) %>
*@
}
</
ul
>
</
div
>
<
div
>
<
ul
>
@{
var firstUser = Model.First();
Html.RenderPartial("_MyLayout_ParitalView", firstUser);
@*
<% Html.RenderPartial("_MyLayout_ParitalView", firstUser);%>
*@
}
</
ul
>
</
div
>
4、Razor 的与布局相关的 Demo
RazorDemoController.cs

using
 
System;
using
 
System.Collections.Generic;
using
 
System.Linq;
using
 
System.Web;
using
 
System.Web.Mvc;
using
 
MVC30.Models;
namespace
 
MVC30.Controllers
{
public
 
class
 
RazorDemoController : Controller
{
public
 
ActionResult LayoutView()
{
return
 
View();
}
}
}
_ViewStart.cshtml

@{
// View 在每次 Render 之前都会先执行 _ViewStart.cshtml 中的代码
Layout = "~/Views/Shared/_Layout.cshtml";
}
_Layout.cshtml

<!DOCTYPE html>
<
html
>
<
head
>
<
title
>@ViewBag.Title</
title
>
<!--
Url.Content() - 将指定的相对路径转换为绝对路径
-->
<
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
>
_MyLayout_MasterPage.cshtml

<!DOCTYPE html>
<
html
>
<
head
>
<
title
>@ViewBag.Title</
title
>
</
head
>
<
body
>
<
div
 
style
=
"background-color: Gray"
>
<!--
引用此 Layout 的页上的未指明 Section 的内容会在此 Render
-->
@RenderBody()
</
div
>
@if (IsSectionDefined("mySection"))
{
// 引用此 Layout 的页后，如果指定名为 mySection 的 Section 的话，其会在此处 Render
// 第二个参数的意思是，引用此 Layout 的页是否必须有名为 mySection 的 Section
@RenderSection("mySection", false)
}
else
{
@:没有 mySection
}
</
body
>
</
html
>
_MyLayout_RenderPage.cshtml

<
h1
>
RenderPage
<
br
 
/>
@{
// 获取 RenderPage() 传递过来的参数
if (@PageData["param"] == "abc")
{
@:param == "abc"
}
if (@PageData["param2"] == "xyz")
{
@:param == "xyz"
}
}
</
h1
>
LayoutView.cshtml

@{
// 指定一个 Layout 页（相当于母版页）
Layout = "_MyLayout_MasterPage.cshtml";
ViewBag.Title = "Razor 的与布局相关的 Demo";
}
<!--
在 Layout 中的 RenderBody() 中显示
RenderPage() 的第二个参数的意思：给 _MyLayout_RenderPage.cshtml 传递参数
-->
在 RenderBody() 中显示的内容
@RenderPage("~/Views/RazorDemo/_MyLayout_RenderPage.cshtml", new { param = "abc", param2 = "xyz"})
<!--
在 Layout 中的 RenderSection("mySection") 中显示
-->
@section mySection {
<
b
>My Section</
b
>
}
5、其他

view sourceprint?

<
p
>
Razor 的 dll 在这里 C:\Program Files\Microsoft ASP.NET\ASP.NET Web Pages\v1.0\Assemblies
</
p
>
<
p
>
Razor 中约定：布局 View 或者需要被别的 View 引用的 View 要以“_”开头
</
p
>
<
p
>
asp.net mvc 3.0 的 T4 模板的位置在 D:\Program Files\Microsoft Visual Studio 10.0\Common7\IDE\ItemTemplates\CSharp\Web\MVC 3\CodeTemplates
<
br
 
/>
如果不想修改默认模板的话，那么就将模板安装到当前项目中，然后只修改当前项目的 T4 模板，方法如下：
<
br
 
/>
Tools ->Library Package Manager ->Package Manager Console，然后输入 install-package mvc3codetemplatescsharp，之后 CodeTemplates 文件夹就会添加到当前项目中
</
p
>
<
p
>
新增的 HTML Helper，例如：Chart, WebGrid, WebImage, WebMail, Crypto 等，详见 System.Web.Helpers.dll
</
p
>

                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航