ASP.NET MVC學(xué)習(xí)教程之Razor語法
前言
ASP.NET MVC 3配有一個(gè)新的名為“Razor”的視圖引擎選項(xiàng)(除了已有的.aspx視圖引擎)。Razor盡量減少編寫一個(gè)視圖模板需要敲入的字符數(shù),實(shí)現(xiàn)快速流暢的編程工作流。與大部分模板的語法不同,你不必在HTML中為了明確地標(biāo)記出服務(wù)模塊的開始和結(jié)束而中斷編程。Razor解析器足夠聰明,能從你的代碼中推斷出來。這使其簡潔,富有表現(xiàn)力的語法輸入干凈,快速,有趣。下面話不多說了,來一起看看詳細(xì)的介紹吧
1. 表達(dá)式
表達(dá)式必須跟在“@”符號之后,
2.代碼塊
代碼塊必須位于“@{}”中,并且每行代碼必須以“;”結(jié)尾。代碼塊中定義的變量可能會(huì)被同一個(gè)域中的其他塊使用。比如,定義在視圖頂部的變量可以被同一視圖中的代碼塊和代碼段訪問。
3. 布局
Razor通過layouts保持網(wǎng)頁外觀布局的一致性。布局模板包含基本的標(biāo)簽,并可以指定渲染視圖內(nèi)容的位置。比如
基本布局文件(_Layout.cshtml)
<!DOCTYPE Html> <html lang=”en”> <head> <mete charset=”utf-8”/> <title>@View.Title</title> </head> <body> <div class=”header”> @RenderSection(“Header”); </div> @RenderBody() <div class=”footer”> @RenderSection(“Footer”); </div> </body> </html>
布局頁面定義完成后,其他視圖頁面就可以引用該布局文件,比如
@{Layout=”~/_Layout.cshtml”;} @section Header { <h1>Page Header Content</h1> } @section Footer { Copyright @DateTime.Now.Year } <div class=”main”> Page Main Content </div>
使用Razor布局和內(nèi)容視圖將頁面組合在一起,展示了一個(gè)完整的頁面,其中的每一塊定義了頁面的不同部分。
4.部分視圖
使用布局通過重用部分HTML代碼做到網(wǎng)站外觀的一致性,但是有一些情況,布局則無法實(shí)現(xiàn),比如,網(wǎng)頁上的一部分信息需要多次重復(fù)出現(xiàn)(格式一致,顯示內(nèi)容不一致),例如,購物網(wǎng)站頁面上的交易列表,只顯示交易名稱、當(dāng)前價(jià)格和摘要信息。
ASP.NET MVC通過部分視圖的技術(shù)實(shí)現(xiàn)了這個(gè)需求。
首先,先定義部分視圖,并保存為單獨(dú)的視圖文件(例如,~/Views/Shared/Acution.cshtml)。
@model Auction <div class=”auction”> <a href=”@Model.Url”><img src=”@Model.ImageUrl”</a> <h4><a href=”@Model.Url”>@Model.Title</a></h4> <p>Current Price :@Model.CurrentPrice</p> </div>
然后,在需要使用該部分視圖的位置,調(diào)用ASP.NET MVC自帶的HTML方法調(diào)用它,比如:
@model IEnumerable<Auction> <h2>Search Result</h2> @foreach(var auction in Model){ @Html.Partial(“Auction”,auction); }
其中,Html.Partial()方法的第一個(gè)參數(shù)“Auction”是部分視圖名稱,并需要包含擴(kuò)展名。第二個(gè)參數(shù)則是傳遞到部分視圖的數(shù)據(jù)模型。第二個(gè)參數(shù)不是必須的,如果不傳遞,系統(tǒng)會(huì)默認(rèn)將調(diào)用該部分視圖的數(shù)據(jù)模型進(jìn)行傳遞,比如,本例中的IEnumerable<Auction>。
由此可見,使用部分視圖能夠降低網(wǎng)頁中的代碼重復(fù)和編碼復(fù)雜性,增強(qiáng)可讀性。
5. 顯示數(shù)據(jù)
MVC架構(gòu)分為三層,模型、視圖和控制器。三層之間彼此分離且協(xié)同工作,其中,就需要控制器擔(dān)當(dāng)“協(xié)調(diào)”的角色,視圖將請求交給控制器,控制器對模型進(jìn)行操作,并將操作結(jié)果反饋給視圖,視圖對模型的數(shù)據(jù)進(jìn)行呈現(xiàn)。
控制器和視圖之間的數(shù)據(jù)傳遞方式,ASP.NET MVC 提供了以下幾種實(shí)現(xiàn)方式:
1) ViewData
ViewData實(shí)現(xiàn)方式,它的實(shí)現(xiàn)類似于Dictionary的操作,使得數(shù)據(jù)傳遞變得非常簡單。
在控制器方法中使用類似于ViewData[“DataKey”]=dataValue
進(jìn)行賦值,在視圖文件中,使用 var dataValue=ViewData[“DataKey”]
獲取數(shù)據(jù)。
2) ViewBag
ViewBag的使用類型與C#中的dynamic類型,可以直接操作其屬性,比如,
控制器方法:ViewBag.DataProperty=dataValue;
視圖文件:var dataValue=ViewBag.DataProperty;
3) Model屬性
Model屬性屬于強(qiáng)類型,并且是動(dòng)態(tài)類型,可以在視圖上輸入”@Model”就可以直接訪問。
6. HTMLHelper和URLHelper
Web請求的目標(biāo)就是向用戶發(fā)送HTML代碼,在Razor語法中,ASP.NET MVC有兩個(gè)重要的幫助類來生成對應(yīng)的HTML代碼,分別是HTMLHelper和URLHelper。HTMLHelper類用來生成HTML標(biāo)記代碼,URLHelper用來生成URL地址鏈接。
<img src='@Url.Content(“~/Content/images/header.jps”)'/> @Html.ActionLink(“Home”,”Index”,”Home”)
渲染得到的HMTL代碼為:
<img src='/vdir/Content/images/header.jpg'/> <a href=”/vdir/Home/Index”>HomePage</a>
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,如果有疑問大家可以留言交流,謝謝大家對腳本之家的支持。
相關(guān)文章
CommunityServer又稱CS論壇的相關(guān)學(xué)習(xí)資料
以前項(xiàng)目需要整合這個(gè)論壇,同事找了一些資料,現(xiàn)在放上來,并說下自己對這個(gè)論壇的看法。2009-05-05ASP.NET Web API如何將注釋自動(dòng)生成幫助文檔
本篇文章主要介紹了ASP.NET Web API從注釋自動(dòng)生成幫助文檔的方法,功能很是強(qiáng)大,現(xiàn)與大家分享一下,需要的朋友可以參考下2015-07-07使用.NET升級助手將.NET?Framework項(xiàng)目升級為.NET?6
這篇文章介紹了使用.NET升級助手將.NET?Framework項(xiàng)目升級為.NET?6的方法,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-04-04詳解ASP.Net Core 中如何借助CSRedis實(shí)現(xiàn)一個(gè)安全高效的分布式鎖
這篇文章主要介紹了ASP.Net Core 中如何借助CSRedis實(shí)現(xiàn)一個(gè)安全高效的分布式鎖,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04Asp.net ajax實(shí)現(xiàn)任務(wù)提示頁面的簡單代碼
這篇文章介紹了Asp.net ajax實(shí)現(xiàn)任務(wù)提示頁面的簡單代碼,有需要的朋友可以參考一下2013-11-11Entity?Framework?Core生成數(shù)據(jù)庫表
這篇文章介紹了Entity?Framework?Core生成數(shù)據(jù)庫表的方法,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-03-03