ASP.NET Web Pages - Razorコードを追加する

このチュートリアルでは、C#とVisualBasicコードを使用してRazorマークアップを使用する方法を説明します。

Razorとは何ですか？

  • Razorはサーバーベースのコードをウェブページに追加するためのマークアップ文法です
  • Razorは伝統的なASP.NETマークアップの能力を持ちつつ、より学習しやすく、使いやすくなっています
  • RazorはASPとPHPに似たサーバーサイドのマークアップ文法です
  • RazorはC#とVisualBasicプログラミング言語をサポートしています

Razorコードを追加する

前章で紹介したページを覚えていますか：

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="utf-8" />
    <title>Web Pages デモ</title>
</head>
<body>
    <h1>Hello Web Pages</h1>
</body>
</html>

例にRazorコードを追加します：

例

<!DOCTYPE html>
<html lang="en">
<head>
     <meta charset="utf-8" />
     <title>Web Pages デモ</title>
</head>
<body>
     <h1>Hello Web Pages</h1> 
     <p>時間は @DateTime.Now</p>
</body>
</html>

実行例

このページには一般的なHTMLタグが含まれており、さらに：@タグで囲まれたRazorコードも含まれています。

Razorコードのすべての仕事は、サーバー上の現在時刻を検出して表示することです。（フォーマットオプションを指定することもできます、またはデフォルトのフォーマットで表示することもできます）

C#の主要なRazor文法規則

  • Razor コードブロックは @{ ... } で囲まれる
  • 行内の式（変数や関数）は @ で始まります
  • コード文はセミコロンで終了する
  • 変数は var キーワードで宣言される
  • 文字列は引用符で囲まれます
  • C# コードは大文字小文字を区別する
  • C# ファイルの拡張子は .cshtml

C# インスタンス

<!-- 単行のコードブロック -->
@{ var myMessage = "Hello World"; }
<!-- 行内の式または変数 -->
<p>myMessageの値は：@myMessage</p> 
<!-- 多行のコードブロック -->
@{}}
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " 今日は: " + weekDay;
}
<p>挨拶は：@greetingMessage</p>

実行例

VBの主要なRazor文法規則

  • Razor コードブロックは @Code ... End で囲まれます
  • 行内の式（変数や関数）は @ で始まります
  • 変数は Dim キーワードで宣言されます
  • 文字列は引用符で囲まれます
  • C# コードは大文字小文字を区別しません
  • C# ファイルの拡張子は .vbhtml

例

<!-- 単行のコードブロック -->
@Code dim myMessage = "Hello World" End Code
<!-- 行内の式または変数 -->
<p>myMessageの値は：@myMessage</p> 
<!-- 多行のコードブロック -->
@Code
dim greeting = "Welcome to our site!" 
dim weekDay = DateTime.Now.DayOfWeek 
dim greetingMessage = greeting & " 今日は: " & weekDay
コードの終わり 
<p>挨拶は：@greetingMessage</p>

実行例

C# と Visual Basic の詳細情報

Razor と C#、Visual Basic プログラミング言語に関するさらに多くの知識を学びたい場合は、このチュートリアルの Razor 部分です。