Mvc-framework-views
MVCフレームワーク-ビュー
最初の入門の章で見たように、Viewはアプリケーションのユーザーインターフェイスに関連するコンポーネントです。 これらのビューは通常、モデルデータからバインドされ、html、aspx、cshtml、vbhtmlなどの拡張機能があります。 最初のMVCアプリケーションでは、コントローラー付きのビューを使用して、最終ユーザーにデータを表示しました。 これらの静的および動的コンテンツをブラウザにレンダリングするために、MVCフレームワークはView Engineを利用します。 View Engineは基本的にマークアップ構文の実装であり、最終的なHTMLをブラウザーにレンダリングする役割を果たします。
MVCフレームワークには、2つの組み込みビューエンジンが付属しています-
*Razor Engine* -Razorは、サーバー側のC＃またはVBコードをWebページに有効にするマークアップ構文です。 このサーバー側のコードを使用して、Webページのロード時に動的コンテンツを作成できます。 Razorは、ASPXエンジンと比較して高度なエンジンであり、MVCの後のバージョンで発売されました。- ASPXエンジン*-ASPXまたはWebフォームエンジンは、最初からMVCフレームワークに含まれているデフォルトのビューエンジンです。 このエンジンを使用してコードを記述することは、ASP.NET Webフォームでコードを記述することに似ています。
以下は、RazorとASPXエンジンの両方を比較する小さなコードスニペットです。
かみそり
@Html.ActionLink("Create New", "UserAdd")ASPX
<% Html.ActionLink("SignUp", "SignUp") %>これら2つの中で、Razorはコンパクトな構文、テスト駆動開発アプローチ、およびより優れたセキュリティ機能を備えているため、高度なView Engineです。 最も使用頻度の高いViewエンジンであるため、すべての例でRazorエンジンを使用します。
これらのビューエンジンは、次の2つのタイプでコーディングおよび実装できます-
- 強く型付けされている
- 動的型付け
これらのアプローチは、それぞれモデルがビューに強くまたは動的にバインドされる事前バインディングと遅延バインディングに似ています。
強く型付けされたビュー
この概念を理解するために、サンプルMVCアプリケーションを作成し（前の章の手順に従って）、 ViewDemoController という名前のコントローラークラスファイルを追加しましょう。
さて、コントローラファイルに次のコードをコピーします-
using System.Collections.Generic;
using System.Web.Mvc;
namespace ViewsInMVC.Controllers {
public class ViewDemoController : Controller {
public class Blog {
public string Name;
public string URL;
}
private readonly List topBlogs = new List {
new Blog { Name = "Joe Delage", URL = "http://finddevguides/joe/"},
new Blog {Name = "Mark Dsouza", URL = "http://finddevguides/mark"},
new Blog {Name = "Michael Shawn", URL = "http://finddevguides/michael"}
};
public ActionResult StonglyTypedIndex() {
return View(topBlogs);
}
public ActionResult IndexNotStonglyTyped() {
return View(topBlogs);
}
}
}上記のコードでは、 StronglyTypedIndex および IndexNotStonglyTyped という2つのアクションメソッドが定義されています。 これらのアクションメソッドのビューを追加します。
StonglyTypedIndexアクションメソッドを右クリックし、[ビューの追加]をクリックします。 次のウィンドウで、「厳密に型指定されたビューを作成する」チェックボックスをオンにします。 これにより、Model ClassおよびScaffoldテンプレートオプションも有効になります。 Scaffold TemplateオプションからListを選択します。 追加をクリックします。
次のスクリーンショットのようなビューファイルが作成されます。 お気づきのとおり、ViewDemoControllerのBlogモデルクラスが上部に含まれています。 このアプローチでは、コードでIntelliSenseを使用することもできます。
動的型付きビュー
動的型付きビューを作成するには、IndexNotStonglyTypedアクションを右クリックし、[ビューの追加]をクリックします。
今回は、「厳密に型指定されたビューを作成する」チェックボックスを選択しないでください。
結果のビューには、次のコードがあります-
@model dynamic
@{
ViewBag.Title = "IndexNotStonglyTyped";
}
<h2>Index Not Stongly Typed</h2>
<p>
<ul>
@foreach (var blog in Model) {
<li>
<a href = "@blog.URL">@blog.Name</a>
</li>
}
</ul>
</p>上記のコードを見るとわかるように、今回は前のケースのようにビューにBlogモデルを追加しませんでした。 また、今回はバインディングが実行時に行われるため、今回はIntelliSenseを使用できません。
実行時にデータがバインドされ、リンクされたモデルで何かが変更された場合に実行時エラーが発生する可能性がある動的な型付きビューとは異なり、モデルとして渡されるデータが既にわかっているため、厳密に型付きのビューはより良いアプローチと見なされます。
