第一個ASP.Net MVC程式

下禮拜要開始在保哥那邊開始上班了
工作內容以MVC為主,所以再來溫習一下MVC的部分
MVC的原理可以參照 Wiki 上的介紹
本篇將先帶領各位入門ASP.Net MVC

1. 下載ASP.Net MVC 3 的安裝程式。

微軟的MVC網站下載最新版本安裝,直接安裝。

2. 新增asp.net mvc 3 web application專案

Create ASP.Net MVC 3 Project

3. 新ASP.NET MVC 3 專案的選擇範本這裡我們先選”空白

4. 此時專案內已經有一些資料夾和檔案了,我們先看Global.asax這檔案

[csharp]public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(
"Default", // Route name
"{controller}/{action}/{id}", // URL with parameters
new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
);
}[/csharp]

此時可以看到註冊了一個預設的Controller,名稱為”Home”,然後Action是”Index”。
routes部分我們日後再介紹。目前讓大家看一下網站首頁是由那裡控制的。

5. 我們來新增一個新的控制器。在Controllers右鍵→加入控制器

Add New Controller

6. 加入控制器中,控制器名稱命名為”HomeController“,Controller不可以省略,要不然程式會找不到控制器。

7. 看到程式自動產生下方這些程式碼。我們暫時先將下方程式碼改成回傳string,然後輸入回傳字串,執行網站觀看結果

[csharp]namespace AsFlexer.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/

//public ActionResult Index()
//{
// return View();
//}

public string Index()
{
return "Hello World, AsFlexer";
}
}
}[/csharp]

此時可以看到HomeController回傳的網站了。

8. 此時我們再將使用原本程式碼return View();然後執行看看,會出現以下的錯誤訊息。

因為程式找不到對應的View可以回傳。可以依照上述那些目錄新增檢視

9-1. 因為我們現在Controller是Home,所以對應要在View下面開一個新的資料夾為”Home”,然後加入檢視

9-2. 或者可以直接在Controller的Action那邊直接加入檢視,之後也可以快速使用”移至檢視”直接觀看View的部分。

10. 我們現在要實作的Action的名稱是Index,所以名稱要和Action名稱互相一致為Index。

11. View的功能主要是呈現網頁的部分,此時將內容改成和下方之後執行看結果。

[csharp]@{
ViewBag.Title = "AsFlexer";
}

<h2>AsFlexer</h2>
<p>Hello World!~(From View)</p>[/csharp]

網頁正常執行,ASP.Net MVC的第一個入門程式已經完成啦~基本運作原理大概知道囉^^

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>