ASP.NET MVC入門 Razorの基本01

最新推荐文章于 2025-07-06 22:22:46 发布

原创最新推荐文章于 2025-07-06 22:22:46 发布 · 235 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#asp.net #mvc

笔记专栏收录该内容

10 篇文章

订阅专栏

本文详细介绍了ASP.NET MVC中Razor视图引擎的基本语法，包括如何输出模型属性、内联表达式、代码块、HTML辅助方法如CheckBoxFor、RadioButtonFor、DropDownListFor以及ListBoxFor的使用，还有如何生成隐藏字段、文本框、标签和超链接。同时，展示了如何使用Html.Raw方法来避免HTML转义，并给出了ActionLink和RouteLink的示例。

markDown先生

Razorの最も基本的な記法で、「@expression」の形式で記述できる

 @Model.Isbn  
モデル・オブジェクトのIsbnプロパティを出力するコード

プロパティを指定

<img src="@(Model.Isbn)_logo.jpg" />  
明示的にIsbnプロパティを指定

インライン式（エスケープ処理をスキップ）跳过转义

 @Html.Raw(Model.Body)  同下ASPX
<%= Model.Body %>

Html.Rawメソッドは内部的にはHtmlStringオブジェクトを生成

 @Html.Raw(new HtmlString(Model.Body))

コード・ブロック

 @{ var str = "ビュー・エンジン"; }
変数strに値を代入するためのコード・ブロック

「@」文字のエスケープ

 examples@wings.msn.to
予約文字である「@」を文字列中に使用

先頭に文字「@」を使用するには「@@」と記述する

 @@IT Insider.NET
予約文字である「@」を文字列中に使用

チェックボックス：
@Html.CheckBoxFor(
model => model.Cd, // プロパティ
new { tabindex = 3 } // そのほかの属性
)

ラジオボタン：
@Html.RadioButtonFor(
model => model.Publish, // プロパティ
“翔泳社”, // 値（value属性）
new { tabindex = 3 } // そのほかの属性
)

@Html.RadioButtonFor(
model => model.Publish, // プロパティ
“技術評論社”, // 値（value属性）
new { tabindex = 3 } そのほかの属性
)

チェックボックス： <input id="Cd" name="Cd" tabindex="3" type="checkbox" value="true" /> <input name="Cd" type="hidden" value="false" />
ラジオボタン： <input id="Publish" name="Publish" tabindex="3" type="radio" value="翔泳社" /> <input checked="checked" id="Publish" name="Publish" tabindex="3" type="radio" value="技術評論社" />

選択ボックス／リストボックスを生成する

Html.DropDownListFor／ListBoxForメソッド

選択ボックス：

@Html.DropDownListFor( model => model.Publish, // プロパティ new SelectListItem[] { new SelectListItem() { Value="翔泳社", Text="翔泳社" }, new SelectListItem() { Value="技術評論社", Text="技術評論社" }, new SelectListItem() { Value="秀和システム", Text="秀和システム" } }, // オプション・リスト "選択してください", // 空値のオプション（ラベル・テキスト） new { @class = "list" } // そのほかの属性 )

` リストボックス：

@Html.ListBoxFor(
model => model.Publish, // プロパティ
new SelectListItem[] {
new SelectListItem() { Value=“翔泳社”, Text=“翔泳社” },
new SelectListItem() { Value=“技術評論社”, Text=“技術評論社” },
new SelectListItem() { Value=“秀和システム”, Text=“秀和システム” }
}, // オプション・リスト
new { size = 5 } // そのほかの属性
)`

		  選択ボックス：
		<select class="list" id="Publish" name="Publish">
		  <option value="">選択してください</option>
		  <option value="翔泳社">翔泳社</option>
		  <option selected="selected" value="技術評論社">技術評論社</option>
		  <option value="秀和システム">秀和システム</option>
		</select>
		
		リストボックス：
		<select id="Publish" multiple="multiple" name="Publish" size="5">
		  <option value="翔泳社">翔泳社</option>
		  <option value="技術評論社">技術評論社</option>
		  <option value="秀和システム">秀和システム</option>
		</select>

隠しフィールドを生成する－ HiddenForメソッド

@Html.HiddenFor(
model => model.Title, // プロパティ
new { } // そのほかの属性
)

    <input id="Title" name="Title" type="hidden" value="JavaScript本格入門" />


---

モデルと関連付かないフォーム要素を生成する－ TextBox／Labelメソッド

@Html.TextBox(
“keywd”, // 要素名ID
null, // 値（value属性）
new { size = 15, maxlength = 19 } // そのほかの属性
new { @class = “list” } // そのほかの属性
)

		<input id="keywd" class="list" maxlength="18" name="keywd" size="15" type="text" value="" />

ハイパーリンクを生成する－ Html.ActionLinkメソッド

@Html.ActionLink(
“詳細”, // リンク・テキスト
“Details”, // アクション名
“Books”, // コントローラ名
new { id = Model.Isbn }, // ルート・パラメータ
new { @class = “menu” } // そのほかの属性
)

	<a class="menu" href="/Books/Details/978-4-7741-4466-5">詳細</a>

###ActionLinkをRouteLinkメソッドで書き換えた例

@Html.RouteLink(
“詳細”, // リンク・テキスト
“Default”, // ルート名
new {
action = “Details”, // アクション名
controller = “Books”, // コントローラ名
id = Model.Isbn // そのほかのパラメータ
}, // ルート・パラメータ
new { @class = “menu” } // そのほかの属性
)