razor

時間 2019-12-09

標籤 razor 简体版

原文原文鏈接

1.Razor簡介

Razor 是一種容許您向網頁中嵌入基於服務器的代碼（Visual Basic 和 C#）的標記語法。當網頁被寫入瀏覽器時，基於服務器的代碼可以建立動態內容。在網頁加載時，服務器在向瀏覽器返回頁面以前，會執行頁面內的基於服務器代碼。因爲是在服務器上運行，這種代碼能執行復雜的任務，好比訪問數據庫。Razor 基於 ASP.NET，它爲 web 應用程序的建立而設計。它擁有傳統 ASP.NET 標記的能力。Razor 網頁可被描述爲帶有兩種內容的 HTML 頁面：HTML 內容和 Razor 代碼。html

2.語法

C# 的主要 Razor 語法規則:
Razor 代碼封裝於 @{ ... } 中;
行內表達式（變量和函數）以 @ 開頭;
代碼語句以分號結尾;
字符串由引號包圍;
C# 代碼對大小寫敏感;
C# 文件的擴展名是 .cshtmlweb

<ul>
@for (int i = 0; i < 10; i++) {
<li>@i</li>
}
</ul>

C#實例：數據庫

<!-- 單行代碼塊 -->
@{ var myMessage =    "Hello World"; }

<!-- 行內表達式或變量 -->
<p>The value of myMessage is: @myMessage</p> 

<!-- 多行語句代碼塊 -->
@{
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>

3.與對象打交道

"Date" 對象是典型的 ASP.NET 內建對象，可是也能夠自行定義對象，一張網頁，一個文本框，一個文件，或者一條數據庫記錄，等等。瀏覽器

Name	Value
Day	@DateTime.Now.Day
Hour	@DateTime.Now.Hour
Minute	@DateTime.Now.Minute
Second	@DateTime.Now.Second

4.變量

變量名必須以字母字符開頭，不能包含空格和保留字符。
使用 var 關鍵詞或類型對變量進行聲明，不過 ASP.NET 一般可以自動肯定數據的類型。服務器

// 使用 var 關鍵詞：
var greeting = "Welcome to W3School";
var counter = 103;
var today = DateTime.Today;

// 使用 data 類型：
string greeting = "Welcome to W3School";
int counter = 103;
DateTime today = DateTime.Today;

數據類型：函數

類型        描述             實例
int        整數           103, 12, 5168
float      浮點數         3.14, 3.4e38
decimal    小數           1037.196543
bool       邏輯值         true, false
string     字符串值       "Hello W3School", "Bill"

轉換數據類型：post

As系列擴展方法和Is系列擴展方法測試

AsInt(), IsInt()
AsBool(),IsBool()
AsFloat(),IsFloat()
AsDecimal(),IsDecimal()
AsDateTime(),IsDateTime()
ToString()

@{
    var i = "10";
}
<p> i = @i.AsInt() </p> <!-- 輸出 i = 10 -->

5.讀取用戶輸入

由 Request[] 函數讀取輸入，並由 IsPost 條件進行測試：this

@{
var totalMessage = "";
if(IsPost)
    {
    var num1 = Request["text1"];
    var num2 = Request["text2"];
    var total = num1.AsInt() + num2.AsInt();
    totalMessage = "Total = " + total;
    }
}
<html>
<body style="background-color: beige; font-family: Verdana, Arial;">
<form action="" method="post">
<p><label for="text1">First Number:</label><br>
<input type="text" name="text1" /></p>
<p><label for="text2">Second Number:</label><br>
<input type="text" name="text2" /></p>
<p><input type="submit" value=" Add " /></p>
</form>
<p>@totalMessage</p>
</body>
</html>

6.If,else if和else

@{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>

demo：spa

@if (Model != null)
    {
         if (Order>=10)
           {
                if (Order.name)
                {
                    <div class="info">
                        @for (int i = 0; i < count; i++)
                          {
                             <div class="info_01">
                                 @if (count != 1)
                                    {
                                        <span class="air_span">購買人@(i + 1)：</span>
                                    }
                                 else
                                    {
                                        <span class="air_span">購買人：</span>
                                    }
                             </div>
                          }
                    </div>
                }
            }
         else if (Order>5&&Order<10) 
           {
               <li>
                    <span class="price">&yen;@Order.price</span>
               </li>
           }
         else 
          {
              ...
          }         
  }

7.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>

8.循環

for循環：

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

forEach循環：

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

while循環：

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

9.用@明確表示內容的起始

<h2>lists</h2>
<ul>
@foreach(var p in lists){
    <li>
        @p.listName

        @if(p.listCount == 0){
            @:(no Left!)
        }
    </li>
}
</ul>

若是沒有將消息 no Left! 嵌套在HTML標籤元素內，Razor不能隱式判斷@if塊中的內容是不是一個內容塊的開始。咱們用「@：字符序列」來明確地指出咱們代碼段裏的這行應被看成是內容塊。
若是要輸出非html標籤和非Razor語句的代碼，則用@:，他的做用是至關於在處於html下面編寫同樣了，如在@：後面能夠加上@就是表示Razor語句的變量:

@{
    var str = "abc";
    //下面會輸出：this is a mail：dxl0321@qq.com, this is var: abc,this is mail@str,this is @；
    @: this is a mail：dxl0321@qq.com, this is var: @str,this is  mail@str,this is @@；
    //下面輸出abc
    @str
}

10.Razor做用塊註釋

razor做用塊裏面自己就是服務器代碼了，所以可以使用服務器代碼的註釋，註釋有 // 和 /*/ 分別是單行註釋和多行註釋。另外razor註釋還可使用自身特有的@ 註釋的內容 *@，支持單行和多行的。

@{
   @*
       多行註釋
       多行註釋
   *@
   var i = 10;  @* asdfasf *@
}

相關標籤/搜索

razor

c#razor

razor+adminlte

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。