尝试Razor
在幾個月以前寫了一篇關于ASP.NET的MVC的博文，當時的視圖沒有用Razor，有園友說了Razor的好處，時隔多月之后，這回體驗一下用Razor，Razor的一個特征就是@，通篇的@，不過這個@的簡便性比ASPX好，寫上去方便，看上去也整潔。
1.Razor基礎語法
?
@***
首先最簡單的就是利用@*** 輸出某個非字面值，這個就相當于ASPX<%= %>，例如輸出這個系統(tǒng)的當前時間@DateTime.Now
在頁面上的結果是
如果是一個字段的話，也是可以用這種方式，可是對于一個字面值例如一個字符串”Hello world”，或布爾值true或整數(shù)1來說，@”Hello world”是不行的。這時就要用另一種形式。
?
@(……..)
@(……..)這種形式能輸出字面值，它能對括號里面的內容經行編碼，就算里面的內容是一個字符串”<br/>”，它輸出的只是一個字符串”<br/>”，而不是html中的換行。包括上面的@***也是一樣，如果一個字符串類型的字段s，它的值是”<br/>”，當@s的時候，結果只是一個字符串”<br/>”，而不是換行。看看生成的html就知道了。
對于以下代碼(s是已經定義了)
@("<br/>")<br/> <br/>@s頁面上的結果
?
生成的html
顯然，在生成html的時候，把@(“<br/>”)和@s都以字符串的形式(“<br/>”)寫到生成的html，而不是單純的標記形式(<br/>)。這里其實和原本ASPX中的<%= %>輸出的道理是一樣的。
說到這里，其實上面用“輸出”這個詞就不對了，不過給我的感覺就跟在控制臺上輸出的效果一樣。
?
@{…….}
接著就到語句塊，使用語句塊的是以這種形式@{}，例如定義一個變量( @{string s=”Hello World”;} )，或者要循環(huán)執(zhí)行一部分代碼，又或者需要進行一個判斷，就需要這語句塊了。也就在程序語言中的流程控制。
?????? 這里就列舉了一個例子，是利用for循環(huán)輸出一個三角形
@{ int c = 0;} @for (int i = 0; i < 10; i++) {for (int j = 0; j <= i; j++,c++){<span style="color:@(c%2==0?"red":"green");margin:5px;"> @(c+" ")</span>}<br /> }這里用了@{....}和@(....)，效果如下，數(shù)字是紅綠顏色交錯的。
還有另一個例子，是if-else 語句的，判斷當前時間，在不同時間段顯示不同的問候語
@if(DateTime.Now.TimeOfDay<new TimeSpan(12,0,0)) { @("上午好！")} else if (DateTime.Now.TimeOfDay < new TimeSpan(18, 0, 0)) { @("下午好！")} else { @("晚上好！")}結果如下
這里要注意下的是，在程序語言中if或者for下面的語句塊如果只有一條語句的話，花括號{} 可以省略，但是Razor不行，如果是這樣
@if(DateTime.Now.TimeOfDay<new TimeSpan(12,0,0))@("上午好！")的話，會報錯的，不過在vs里面的提示也會看得出來。
?
@using
上面的例子有用到一個System命名空間下的結構DateTime，如果現(xiàn)在想調用.net其他命名空間的類，當然可以用類的完全限定名，但是如果在反復使用的情況下，敲打類前面的命名空間這個工作量不小，Razor也可以跟cs文件里的那樣使用命名空間。
例如
@using System.Threading;@DateTime.Now <br/> @{Thread.Sleep(1000);} @DateTime.Now <br/> @{Thread.Sleep(3000);} @DateTime.Now結果如下
當然我這里是為了舉例才用這個Thead的類，與cs文件里的不同，Razor的命名空間不一定全都要堆在文件的開頭。
母板頁
在Razor中使用母板頁，也不會有之前ASPX那樣的master文件。與其他文件一樣都是cshtml后綴。在使用方面，在需要放子頁內容的地方調用@RenderBody()則可，這個就代替了原本在ASPX中的<asp:ContentPlaceHolder ID="MainContent" runat="server" />標簽了。在子頁方面，只需要放上這么一行代碼就行了@{Layout = "~/Views/Shared/MyLayout.cshtml";}，這就說明了當前子頁要使用Mylayout這個模板頁，當前的子頁內容會插到母版頁的@RenderBody()中去。
先列舉一下母板頁的代碼
<!DOCTYPE html> <html> <head><title>@ViewBag.Title</title><script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script><style type="text/css">input.btn{ background-color:Orange; color:White; font-weight:bold;}</style><script type="text/javascript">$(function () {alert("hello world");});</script> </head><body><div><span>This is a simple page</span><ul><li><a href="#">Home</a></li><li><a href="#">Register</a></li></ul>@RenderBody()</div> </body> </html>子頁的代碼
@{Layout = "~/Views/Shared/MyLayout.cshtml";ViewBag.Title = "Test"; }id:<input type="text" /><br />password:<input type="password" />效果圖
如果在母板頁中插入子頁的內容不止一個，那就要用另一種形式了
母板頁@RenderSection("標識符")
子頁@section 標識符{
??? ……內容….
}
例子如下
母板頁
<!DOCTYPE html> <html> <head><title>@ViewBag.Title</title><script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script><style type="text/css">input.btn{ background-color:Orange; color:White; font-weight:bold;}</style><script type="text/javascript">$(function () {alert("hello world");});</script> </head><body><div><span>This is a simple page</span><ul><li><a href="#">Home</a></li><li><a href="#">Register</a></li></ul>@RenderSection("login")</div><div>@RenderSection("footer")</div> </body> </html>子頁
@{Layout = "~/Views/Shared/MyLayout.cshtml";ViewBag.Title = "Test"; } @section login{id:<input type="text" /><br />password:<input type="password" /> }@section footer{<span>this is a footer</span> }結果
在不確定子頁是否有實現(xiàn)某部分的內容時，可以調用IsSectionDefined(“標識符”)作一個判斷，如果有則引用子頁的相應內容，如果沒有可以做一些默認的操作
例如
@if (IsSectionDefined("footer")){@RenderSection("footer")}else { <span>defalut footer</span>}?
使用行為方法傳來的模型
利用@Model可以獲取到一個Action中傳來的對應的模型，它是一個只讀的屬性。從這個屬性獲取的實例要從Controller進行傳輸，如果沒有則“Model”將為null。獲取了這個實例之后就可以訪問實例的字段，屬性調用它的方法等。
如這里簡單定義了一個模型
public class TestModel{public int Number1{get;set;}public int Number2 { get; set; }public int Sum { get { return Number1 + Number2; } }public int AddOuter(int num1, int num2){return num1 + num2;}}控制器的行為方法如下，就構造了一個模型的實例，給它兩個數(shù)字賦了值，最后傳到視圖中去。
public ActionResult TestPage(){TestModel model = new TestModel();model.Number1 = 1;model.Number2 = 2;return View(model);}最后在視圖上就可以通過@Model來獲取該實例了。
Model.Sum= @Model.Sum <br /> Now Model.Number1 = 3 Model.Number2 = 2; @{Model.Number1 = 3;Model.Number2 = 2; }<br /> Model.Sum= @Model.Sum<br />Model.AddOuter(10, 20) @Model.AddOuter(10, 20)結果如下
2.Html的表單元素的應用
接下來介紹一下一些Html的表單元素在Razor
Label
Label有兩個方法，一個是Label(“expression”)，另一個是Label(“expression”,”labelText”)，Label標簽有個for屬性，expression參數(shù)的值就是for屬性的值，labelText是label的內容，是經過編碼的，不能成為一個真正的層
例如
@Html.Label("Hello world") <br /> @Html.Label("hello world","<div>label text</div>") <label><div>text</div></label>生成的html如下
?
TextBox
TextBox有以下幾個重載個方法
TextBox(string name) TextBox(string name, object value) TextBox(string name, object value, IDictionary<string, object> htmlAttributes) TextBox(string name, object value, object htmlAttributes)由參數(shù)的名稱都可以看出用途了
這里列舉一個帶樣式的textbox例子
@Html.TextBox("textBox1","value",new { style = "font-size:15px; color:red;"})生成的html如下
<input id="textBox1" name="textBox1" style="font-size:15px; color:red;" type="text" value="value"/>文本框肯定是一個input標簽的最后一個參數(shù)是傳遞html屬性的，那么input標簽的屬性有type、name、id這些，我經過嘗試在最后一個參數(shù)中傳遞了一下屬性
type="password",value="123456",name="textbox2",id="textbox3"發(fā)現(xiàn)成功的有type、id，文本框變成了一個密碼框了，但是value和name確改不成功。
?
DropDownList
DropDownList最簡單的一個方法是DropDownList( string name)，可是我使用的時候老是有這個異常
There is no ViewData item of type 'IEnumerable<SelectListItem>' that has the key
發(fā)現(xiàn)最簡單能用的就這樣了
@Html.DropDownList("ddl1", new List<SelectListItem>(),)不過這樣生成DropDownList沒有默認值，如果要有默認值則用下面這種形式
@Html.DropDownList("ddl1", new List<SelectListItem>(), "-- 請選擇 --")它就生成這樣的html
<select id="ddl1" name="ddl1"><option value="">-- 請選擇 --</option> </select>第二個參數(shù)是一個泛型的SelectListItem列表，這個List只要能傳進來就可以了。
例如
@Html.DropDownList("ddl1", new List<SelectListItem>() {new SelectListItem() { Text="男", Value="man"},new SelectListItem(){Text="女", Value="woman"}},"-- 請選擇 --")生成的html如下
<select id="ddl1" name="ddl1"><option value="">-- 請選擇 --</option><option value="man">男</option><option value="woman">女</option> </select>如果要增加一些html屬性的，就這樣子
@Html.DropDownList("ddl1",new List<SelectListItem>() {new SelectListItem() { Text="男", Value="man"},new SelectListItem(){Text="女", Value="woman"}},"-- 請選擇 --", new { style = "font-size:14px; color: #00ffee;" })?
?
?
由于認識尚淺，故有什么說錯說漏的，請各位盡管的批，在下虛心接納，謝謝!
轉載于:https://www.cnblogs.com/HopeGi/archive/2013/05/22/3092074.html
與50位技術專家面對面20年技術見證，附贈技術全景圖總結
- 上一篇： C#：如何去掉groupbox的边框线
- 下一篇： 我心目中理想的开源软件