【MVC架構】Razor文法

前言

  Razor 是一種标記文法，可以讓您将基于伺服器的代碼（Visual Basic 和 C#）嵌入到網頁中。

  Razor是基于伺服器的代碼可以在網頁傳送給浏覽器時，建立動态 Web 内容。當一個網頁被請求時，伺服器在傳回頁面給浏覽器之前先執行頁面中的基于伺服器的代碼。通過伺服器的運作，代碼能執行複雜的任務，比如進入資料庫。

叙述

Razor

   Razor 是基于 ASP.NET 的，是為建立 Web 應用程式而設計的。它具有傳統 ASP.NET 的功能，但更容易使用并且更容易學習

   Razor是ASP.NET MVC支援的視圖引擎之一。Razor允許您使用C＃或Visual Basic編寫HTML和伺服器端代碼的組合。視圖基本文法的Razor視圖具有.vbhtml檔案擴充名，C＃文法具有.cshtml檔案擴充名。

Razor C# 文法規則

（1）Razor 代碼塊包含在 @{ ... } 中

（2）内聯表達式（變量和函數）以 @ 開頭

（3）代碼語句用分号結束

（4）變量使用 var 關鍵字聲明

（5）字元串用引号括起來

（6）C# 代碼區分大小寫

（7）C# 檔案的擴充名是 .cshtml

如何編寫Razor代碼

内聯表達式：

   用@符号開始，用Html代碼編寫伺服器端C＃或VB代碼。例如，編寫@Variable_Name來顯示伺服器端變量的值。例如，DateTime.Now傳回目前日期和時間。是以，寫@ DateTime.Now來顯示目前的日期時間，如下所示。單行表達式在表達式的末尾不需要分号。

<h1>Razor syntax demo</h1>

<h2>@DateTime.Now.ToShortDateString()</h2>
           

多語句代碼塊：

   可以在花括号裡面寫多行的伺服器端代碼@{ ... }。每行必須以與C＃相同的分号結尾。

@{
    var date = DateTime.Now.ToShortDateString();
    var message = "Hello World";
}

<h2>Today's date is: @date </h2>
<h3>@message</h3>
           

顯示來自代碼塊的文本：

（1）使用@:或<text>/<text>顯示代碼塊中的文本。

@{
    var date = DateTime.Now.ToShortDateString();
    string message = "Hello World!";
    @:Today's date is: @date <br />
    @message                               
}
           

（2）在代碼塊中使用<text>顯示文本，如下所示。

@{
    var date = DateTime.Now.ToShortDateString();
    string message = "Hello World!";
    <text>Today's date is:</text> @date <br />
    @message                               
}
           

if-else條件：

  寫@ if條件開始的條件。if-else代碼塊必須包含在大括号{}中，即使是單個語句也是如此。

@if(DateTime.IsLeapYear(DateTime.Now.Year) )
{
    @DateTime.Now.Year @:is a leap year.
}
else { 
    @DateTime.Now.Year @:is not a leap year.
}
           

for循環：

@for (int i = 0; i < 5; i++) { 
    @i.ToString() <br />
}
           

模型：

  使用@model在視圖中的任何位置使用模型對象。

@model Student

<h2>Student Detail:</h2>
<ul>
    <li>Student Id: @Model.StudentId</li>
    <li>Student Name: @Model.StudentName</li>
    <li>Age: @Model.Age</li>
</ul>
           

聲明變量：

      在括号内的代碼塊中聲明一個變量，然後用@符号在html内部使用這些變量。

@{ 
    string str = "";

    if(1 > 0)
    {
        str = "Hello World!";
    }
}

<p>@str</p>
           

它是如何工作的？

1、Razor 是一種将伺服器代碼嵌入在網頁中的簡單的程式設計文法。

2、Razor 文法是基于 ASP.NET 架構，專門用于建立 Web 應用程式的部分 Microsoft.NET 架構。

3、Razor 文法支援所有 ASP.NET 的功能，但是使用的是一種簡化文法，對初學者而言更容易學習，對專家而言更有效率的。

4、Razor 網頁可以被描述成帶以下兩種類型内容的 HTML 網頁： HTML 内容和 Razor 代碼。

5、當伺服器讀取頁面時，它首先運作 Razor 代碼，然後再發送 HTML 頁面到浏覽器。在伺服器上執行的代碼能夠執行一些在浏覽器上不能完成的任務，比如，通路伺服器資料庫。伺服器代碼能建立動态的 HTML 内容，然後發送到浏覽器。從浏覽器上看，伺服器代碼生成的 HTML 與靜态的 HTML 内容沒有什麼不同。

6、帶 Razor 文法的 ASP.NET 網頁有特殊的檔案擴充名 cshtml（Razor C#）或者 vbhtml（Razor VB）。

小結

（1）使用@來編寫伺服器端代碼。

（2）伺服器端代碼塊以@ {* code *}開頭

（3）使用@：或<text> </ <text>顯示代碼塊中的文本。

（4）if條件以@if {}開頭

（5）for循環以@for開頭

（6）@model允許您在視圖中的任何位置使用模型對象。