溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

ASP.NET中的Razor語法是什么

發(fā)布時(shí)間：2022-06-14 09:20:09 來源：億速云 閱讀：148 作者：zzz 欄目：開發(fā)技術(shù)

本文小編為大家詳細(xì)介紹“ASP.NET中的Razor語法是什么”，內(nèi)容詳細(xì)，步驟清晰，細(xì)節(jié)處理妥當(dāng)，希望這篇“ASP.NET中的Razor語法是什么”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學(xué)習(xí)新知識(shí)吧。

Razor 不是一種編程語言。它是服務(wù)器端的標(biāo)記語言?？梢宰屇鷮⒒诜?wù)器的代碼（Visual Basic 和 C#）嵌入到網(wǎng)頁中。

當(dāng)服務(wù)器讀取頁面時(shí)，它首先運(yùn)行 Razor 代碼，然后再發(fā)送 HTML 頁面到瀏覽器。在服務(wù)器上執(zhí)行的代碼能夠執(zhí)行一些在瀏覽器上不能完成的任務(wù)，比如，訪問服務(wù)器數(shù)據(jù)庫。服務(wù)器代碼能創(chuàng)建動(dòng)態(tài)的 HTML 內(nèi)容，然后發(fā)送到瀏覽器。從瀏覽器上看，服務(wù)器代碼生成的 HTML 與靜態(tài)的 HTML 內(nèi)容沒有什么不同。

一、Razor 語法

1、 Razor C# 語法規(guī)則

  • Razor 代碼塊包含在 @{ ... } 中 ，當(dāng)行或多行。

  • 內(nèi)聯(lián)表達(dá)式（變量和函數(shù)）以 @ 開頭 ：@變量 或 @( 表達(dá)式 )

  • 代碼語句用分號(hào)結(jié)束

  • 變量使用 var 關(guān)鍵字聲明

  • 字符串用引號(hào)括起來

  • C# 代碼區(qū)分大小寫

  • C# 文件的擴(kuò)展名是 .cshtml

<!-- Single statement block -->
@{ var myMessage =    "Hello World"; }

<!-- Inline expression or variable -->
<p>The value of myMessage is: 
@myMessage
</p> 

<!--    Multi-statement block -->
@{
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Here in Huston it is: " + weekDay;
}
<p>The greeting is: 
@greetingMessage
</p>

2、Razor的作用域

大括號(hào)里面的就是表示作用域的范圍，用形如 “@[code]”來寫一段代碼塊。在作用域 “@(code)” 中輸出也是用@符號(hào)的。

我的年齡：
@{
    int age = 25;
    string sex = "男";
    @age
}性別： @(sex)

3、Razor和Html混合編寫

  • a.在作用域內(nèi)容如果是以html標(biāo)簽開始則視為文本輸出

  • b.如果輸出@，則使用@@

  • c.如果需在代碼塊中直接輸出純文字而不帶HTML標(biāo)簽，則可以使用@:標(biāo)簽，如果在 "@:" 后面加上@就表示Razor語句的變量。

@{
    var strzm = "abc";
    @:this is a mail:2734796332@qq.com.this is var:@strzm,this is mail@strzm,this is @@

    //輸出abc
    @strzm
 }

如果需要在代碼塊中輸出續(xù)或不連續(xù)的多行純文本，則使用text標(biāo)簽較為方便。

@if (Model.Price > 5M) {
<text> 名稱：<b>@Model.Name</b><br /> 分類：<b>@Model.Description</b><br /> 價(jià)錢：<b>@Model.Price</b><br /> <pre> 測(cè)試行一: <a>aaaa</a> 測(cè)試行二: @@ fda@aaa </pre> </text>

}

4、變量

一個(gè)變量的名稱必須以字母字符開頭，并且不能包含空格或者保留字符。變量使用 var 關(guān)鍵字聲明，或通過使用具體類型聲明。

// Using the var keyword:
var greeting = "Welcome to RUNOOB.COM";
var counter = 103;

// Using data types:
string greeting = "Welcome to RUNOOB.COM";
int counter = 103;

5、數(shù)據(jù)類型

  • int    整數(shù)（全數(shù)字）    103, 12, 5168

  • float    浮點(diǎn)數(shù)    3.14, 3.4e38

  • decimal    十進(jìn)制數(shù)字（高精度）    1037.196543

  • bool    布爾值    true, false

  • string    字符串    "Hello RUNOOB.COM", "John"

6、轉(zhuǎn)換數(shù)據(jù)類型(string類型才能轉(zhuǎn))

  • AsInt()\IsInt():    轉(zhuǎn)換字符串為整數(shù)   

    if (myString.IsInt()){
   myInt=myString.AsInt();
}

  • AsFloat()\IsFloat():    轉(zhuǎn)換字符串為浮點(diǎn)數(shù)。  

  • AsDecimal()\IsDecimal():轉(zhuǎn)換字符串為十進(jìn)制數(shù)。

  • AsDateTime()\IsDateTime():    轉(zhuǎn)換字符串為 ASP.NET DateTime 類型。  

  • AsBool()\IsBool():    轉(zhuǎn)換字符串為布爾值。  

  • ToString():    轉(zhuǎn)換任何數(shù)據(jù)類型為字符串。

    var  myInt=1234;
myString=myInt.ToString();

7、循環(huán)

For 循環(huán)

<body>
@for(var i = 10; i < 21; i++) {<p>Line @i</p>}
</body>

For Each 循環(huán)

<body>
<ul>
@foreach (var x in Request.ServerVariables)
{
<li>@x</li>
}
</ul>
</body>

While 循環(huán)

<body>
@{ var i = 0; while (i < 5) {i += 1; <p>Line @i</p> } }
</body>

8、數(shù)組

</p>
<p>Kai is now in position@{
string[] members = {"Jani", "Hege", "Kai", "Jim"};
int i = Array.IndexOf(members, "Kai")+1;
int len = members.Length;
string x = members[2-1];
}
<html>
<body>
<h4>Members</h4>
@foreach (var person in members)
{
<p>@person</p>

}
<p>The number of names in Members are 
@l
en</p>
<p>The person at position 2 is 
@x
</p>
<p>Kai is now in position 
@i
</p>
</body>
</html>

9、邏輯條件

If 條件

@{var price=50;}
<html>
<body>
@if (price>30)
{
<p>The price is too high.</p>

}
</body>
</html>

Else 條件

@{var price=20;}
<html>
<body>
@if (price>30)
{
<p>The price is too high.</p> } else { <p>The price is OK.</p>

} 
</body>
</html>

Else If 條件

@{var price=25;}
<html>
<body>
@if (price>=30) { <p>The price is high.</p> } else if (price>20 && price<30) { <p>The price is OK.</p> } else { <p>The price is low.</p> }
</body>
</html>

Switch 條件

@{
var weekday=DateTime.Now.DayOfWeek;
var day=weekday.ToString();
var message="";
}
<html>
<body>
@switch(day)
{
case "Monday":
message="This is the first weekday.";
break;
case "Thursday":
message="Only one day before weekend.";
break;
case "Friday":
message="Tomorrow is weekend!";
break;
default:
message="Today is " + day;
break;
}
<p>
@message
</p>
</body>
</html>

二、Razor引擎

1、布局(Layout)(@RenderBody()方法)

解釋：Layout方式布局就相當(dāng)于一個(gè)模板，我們?cè)谒刂返胤饺ヌ砑哟a。類似于ASP.NET母版頁中的ContentPlaceHolder服務(wù)器控件，在MVC中使用@RenderBody()來呈現(xiàn)子Web頁面的內(nèi)容，它可以省去我們?cè)诿總€(gè)視圖文件中寫相同的html元素、JS和樣式等的工作。 
母版頁：(~/Views/Layout/_SiteLayout.cshtml)

母版的呈現(xiàn)是MVC內(nèi)部處理的，這種以下劃線（_）開頭的視圖文件，一般是不能直接返回給用戶。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>我的網(wǎng)站 - @Page.Title</title>
    </head>
    <body>
        @RenderBody()
    </body>
</html>

子頁面：(~/Views/Home/About.cshtml)

@{
    Layout = "~/Views/Layout/_SiteLayout.cshtml";
}
<h2>
    關(guān)于我的網(wǎng)站
</h2>
<p>
    這是一些內(nèi)容顯示在關(guān)于我們這個(gè)頁面，我們用的是SiteLayout.cshtml這個(gè)主頁母版頁。
    <br />
    當(dāng)前時(shí)間：@DateTime.Now
</p>

2、頁面(@RenderPage()方法)

解釋：page當(dāng)需要在一個(gè)頁面中，輸出另外一個(gè)Razor文件(頁面)的內(nèi)容時(shí)候用到，比如頭部或尾部這些公共的內(nèi)容時(shí)需要用到，用@RenderPage()方法

母版頁：(~/Views/Layout/_SiteLayout.cshtml)

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Simple Site</title>
</head>
<body>
   <!--頭部-->    
   @RenderPage("~/Views/Layout/_header.cshtml")
</body>
</html>

公共頁：(~/Views/Layout/_header.cshtml)

<div id="header">
        <a href="#" rel="external nofollow"  rel="external nofollow" >主頁</a>
        <a href="#" rel="external nofollow"  rel="external nofollow" >關(guān)于我們</a>
</div>

3、Section區(qū)域(@RenderSection())

解釋：Section是定義在Layout的頁面中使用的。在Layout的頁面中用。在要Layout的父頁面中使用@RenderSection()方法。

  • @RenderSecion()這個(gè)占位符表示：在這里會(huì)渲染頁面里面的一個(gè)節(jié)（可以是html代碼也可以是c#代碼和Html的結(jié)合體）。

  • @RenderSection("scripts", required: false)做一個(gè)補(bǔ)充說明，第一個(gè)參數(shù)指明：在子頁面被渲染的節(jié)的名稱，第二個(gè)參數(shù)：指定子頁面這個(gè)節(jié)是否是必需的，如果指定了required:true;但是在子頁面沒有給這個(gè)名稱的節(jié)的話，編譯是通不過的。

母版頁：(~/Views/Layout/_SiteLayout.cshtml)

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Simple Site</title>
</head>
<body>
    <div id="left-menu">
        @RenderSection("menu",true)
    </div>
</body>
</html>

公共頁：(~/Views/Layout/_menu.cshtml)

@{
    Layout = "~/Views/Layout/_SiteLayout.cshtml";
}
<h2>
    關(guān)于我的網(wǎng)站
</h2>
<p>
    這是一些內(nèi)容顯示在關(guān)于我們這個(gè)頁面，我們用的是SiteLayout.cshtml這個(gè)主頁母版頁。
    <br />
    當(dāng)前時(shí)間：@DateTime.Now
</p>
@section menu{
    
<ul id="sub-menu"> <li>菜單1</li> <li>菜單2</li> <li>菜單3</li> <li>菜單4</li> </ul> }

如果在子頁面中沒有去實(shí)現(xiàn)了menu了，則會(huì)拋出異常。我們可以使用它的重載@RenderSection("menu", false)

@if (IsSectionDefined("menu")) { @RenderSection("menu", false) } else { <p>menu Section is not defined!</p> }

三、Razor 幫助器

ASP.NET 幫助器是通過幾行簡(jiǎn)單的 Razor 代碼即可訪問的組件。您可以使用 Razor 語法構(gòu)建自己的幫助器，或者使用內(nèi)建的 ASP.NET 幫助器。

下面是一些有用的 Razor 幫助器的簡(jiǎn)短說明：

  • Web Grid（Web 網(wǎng)格）

  • Web Graphics（Web 圖形）

  • Google Analytics（Google 分析）

  • Facebook Integration（Facebook 集成）

  • Twitter Integration（Twitter 集成）

  • Sending Email（發(fā)送電子郵件）

  • Validation（驗(yàn)證）

@Href("~/")//表示網(wǎng)站的根目錄 
@Html.Raw('<font color='red'>紅字</font>')就會(huì)顯示出紅色的”紅字“，不用的話會(huì)直接顯示這段html字符串（<font color='red'>紅字</font>）

自定義Helper

 @helper就是可以定義可重復(fù)使用的幫助器方法，不僅可以在同一個(gè)頁面不同地方使用，還可以在不同的頁面使用。

1、新建一個(gè)HelperMath.cshtml頁面

ASP.NET中的Razor語法是什么

ASP.NET中的Razor語法是什么

2、HelperMath.cshtml頁面寫方法

@*求和*@
@helper sum(int a, int b)
{
    int result = a + b;
    @result
}

3、Index.cshtml頁面調(diào)用

1+2= @HelperMath.sum(1, 2)
 <br />

讀到這里，這篇“ASP.NET中的Razor語法是什么”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識(shí)點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過才能領(lǐng)會(huì)，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手