ASP.NET Razor - Sintassi del codice in C# e VB

Razor supporta contemporaneamente C# (C sharp) e VB (Visual Basic).

Le principali regole di sintassi di Razor in C#

  • Il codice Razor è racchiuso in @{ ... }
  • Le espressioni inline (variabili e funzioni) iniziano con @
  • Le istruzioni di codice si concludono con un punto e virgola
  • Le stringhe sono racchiuse tra virgolette
  • Il codice C# è sensibile alle maiuscole e minuscole
  • L'estensione dei file C# è .cshtml

Esempio di C#

<!-- Blocco di codice singolo -->
@{ var myMessage =	"Hello World"; }
<!-- Espressioni o variabili inline -->
<p>Il valore di myMessage è: @myMessage</p> 
<!-- Blocco di codice multistruttura -->
@{
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Here in Huston it is: " + weekDay;
}
<p>Il messaggio di saluto è: @greetingMessage</p>

Esegui esempio

Le principali regole di sintassi di Razor in VB

  • I blocchi di codice Razor sono racchiusi tra @Code ... End Code
  • Le espressioni inline (variabili e funzioni) iniziano con @
  • Le variabili vengono dichiarate con la parola chiave Dim
  • Le stringhe sono racchiuse tra virgolette
  • VB è insensibile alle maiuscole e minuscole
  • L'estensione dei file VB è .vbhtml

Esempio

<!-- Blocco di codice singolo -->
@Code dim myMessage = "Hello World" End Code
<!-- Espressioni o variabili inline -->
<p>Il valore di myMessage è: @myMessage</p> 
<!-- Blocco di codice multistruttura -->
@Code
dim greeting = "Welcome to our site!" 
dim weekDay = DateTime.Now.DayOfWeek 
dim greetingMessage = greeting & " Here in Huston it is: " & weekDay
Fine del codice 
<p>Il messaggio di saluto è: @greetingMessage</p>

Esegui esempio

Come funziona?

Razor è una semplice sintassi di programmazione utilizzata per incorporare codice server-side nelle pagine web.

La sintassi Razor si basa sul framework ASP.NET, che è una componente del framework .NET di Microsoft progettata specificamente per la sviluppo di applicazioni web.

La sintassi Razor ti offre tutte le capacità di ASP.NET, ma con una sintassi semplificata, che rende più facile l'apprendimento per i principianti e più produttivo per gli esperti.

Razor 网页可被描述为带有两种内容的 HTML 页面：HTML 内容和 Razor 代码。

当服务器读取这种页面后，在将 HTML 页面发送到浏览器之前，会首先运行 Razor 代码。这些在服务器上执行的代码能够完成浏览器中无法完成的任务，比如访问服务器数据库。服务器代码能够在页面被发送到浏览器之前创建动态的 HTML 内容。从浏览器的角度来看，由服务器代码生成的 HTML 与静态 HTML 内容没有区别。

使用 Razor 语法的 ASP.NET 网页具有特殊的文件扩展名 cshtml（使用 C# 的 Razor 语法）或者 vbhtml（使用 VB 的 Razor）。

与对象打交道

服务器代码通常涉及对象。

"Date" 对象是典型的 ASP.NET 内建对象，但是也可以自行定义对象，一张网页，一个文本框，一个文件，或者一条数据库记录，等等。

对象可以拥有能够执行的方法。数据库记录可以提供“保存”方法，图像对象可以有“旋转”方法，电子邮件对象可以提供“发送”方法，等等。

对象也可以有描述其特点的属性。数据库记录可以有 FirstName 和 LastName 属性。

ASP.NET Date 对象具有 Now 属性（写作 Date.Now），Now 属性具有 Day 属性（写作 Date.Now.Day）。下面的例子展示了如何访问 Date 对象的某些属性：

Esempio

<table border="1">
<tr>
<th width="100px">Name</th>
<td width="100px">Value</td>
</tr>
<tr>
<td>Day</td><td>@DateTime.Now.Day</td>
</tr>
<tr>
<td>Hour</td><td>@DateTime.Now.Hour</td>
</tr>
<tr>
<td>Minute</td><td>@DateTime.Now.Minute</td>
</tr>
<tr>
<td>Second</td><td>@DateTime.Now.Second</td>
</tr>
</td>
</table>

Esegui esempio

If 和 Else 条件

动态网页的重要特性是基于条件来确定执行的动作。

通常实现这一点的常用方法是使用 if ... else 语句：

Esempio

@{
var txt = "";
if(DateTime.Now.Hour > 12)
  {txt = "Buona Sera";}
else
  {txt = "Buongiorno";}
}
<html>
<body>
<p>Il messaggio è @txt</p>
</body>
</html>

Esegui esempio

Leggi l'input dell'utente

Un'altra importante caratteristica delle pagine web dinamiche è leggere l'input dell'utente.

Legge l'input tramite la funzione Request[] e viene testato con la condizione IsPost:

Esempio

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

Esegui esempio