共用方式為


從新的控制器存取模型資料

作者:Rick Anderson

注意

本教學課程的更新版本可在此取得,它使用最新版的 Visual Studio。 新的教學課程會使用 ASP.NET Core MVC,它在本教學課程提供多種改良。

本教學課程可讓您了解 ASP.NET Core MVC 與控制器和檢視。 Razor 頁面是 ASP.NET Core 中的新替代方案,它是以頁面為基礎的程式設計模型,可讓 Web UI 的建立更容易且更有效率。 建議您在嘗試使用 MVC 版本之前,先試試 Razor 頁面教學課程。 Razor 頁面教學課程:

  • 比較容易學習。
  • 涵蓋更多功能。
  • 是開發新應用程式的建議方法。

在本節,您將建立新的 MoviesController 類別,然後撰寫程式碼來擷取電影資料,並使用檢視範本在瀏覽器中顯示。

在繼續進行下個步驟之前,請先建置應用程式。 如果您未建置應用程式,將會在新增控制器時發生錯誤。

在 [方案總管] 以滑鼠右鍵按一下 [Controllers] 資料夾,然後按一下 [新增],再按一下 [控制器]

螢幕擷取畫面所示為方案總管視窗。「Controllers」資料夾的右鍵功能表已開啟,且 [新增] 已選取。子功能表的 [控制器] 已選取。

「新增架構」對話方塊中,按一下 [使用 Entity Framework 執行檢視的 MVC 5 控制器],然後按一下 [新增]

螢幕擷取畫面所示為「新增架構」對話方塊其中 [使用 Entity Framework 執行檢視的 MVC 5 控制器] 已選取。

  • 為模型類別選擇 [Movie (MvcMovie.Models)]

  • 將資料內容類別選為 [MovieDBContext (MvcMovie.Models)]

  • 在控制器名稱輸入「MoviesController」

    下圖顯示已填寫的對話方塊。

螢幕擷取畫面所示為「新增控制器」對話方塊,其中包含已輸入的類別和名稱資料。

按一下新增。 (如果您收到錯誤,您可能在開始新增控制器之前並未建置應用程式。) Visual Studio 會建立下列檔案和資料夾:

  • Controllers 資料夾中的 MoviesController.cs 檔案。
  • Views\Movies 資料夾。
  • 新的 Views\Movies 資料夾中的 Create.cshtml、Delete.cshtml、Details.cshtml、Edit.cshtmlIndex.cshtml

Visual Studio 會自動為您建立 CRUD (建立、讀取、更新和刪除) 動作方法和檢視 (自動建立 CRUD 動作方法和檢視就是所謂的 Scaffolding)。 您現在擁有功能完整的 Web 應用程式,可建立、列出、編輯和刪除電影項目。

執行應用程式,然後按一下 [MVC Movie] 連結 (或將 /Movies 附加到瀏覽器網址列的 URL 來前往 Movies 控制器)。 由於應用程式依賴預設路由 (定義於 App_Start\RouteConfig.cs 檔案),瀏覽器要求 http://localhost:xxxxx/Movies 會路由至 Movies 控制器的預設 Index 動作方法。 換句話說,瀏覽器要求 http://localhost:xxxxx/Movies 基本上與瀏覽器要求 http://localhost:xxxxx/Movies/Index 相同。 取得的結果是空白電影清單,因為您尚未新增任何電影。

螢幕擷取畫面所示為 MVC Movie 頁面,其中包含空白的 Index 清單。

建立電影

選取 Create New 連結。 輸入電影的詳細資料,然後按一下 [建立] 按鈕。

顯示「建立電影」頁面的螢幕擷取畫面。

注意

您在「Price」欄位可能無法輸入小數點或逗號。 若要針對將逗號 (「,」) 用於小數點的非英文地區設定及非美式英文日期格式支援 jQuery 驗證,您必須加入 globalize.js 和特定 cultures/globalize.cultures.js 檔案 (從 https://github.com/jquery/globalize) 和 JavaScript 才能使用 Globalize.parseFloat。 我會在下個教學課程示範如何執行這項操作。 現在,只要輸入如 10 之類的整數。

按一下 [建立] 按鈕會使表單發佈至伺服器,亦即將電影資訊儲存在資料庫的位置。 接著,系統會將您重新導向至 /Movies URL,您可以在清單中看到新建的電影。

螢幕擷取畫面顯示已新增電影的「Index」頁面。

建立幾個電影項目。 嘗試 EditDetailsDelete 連結,這些連結都可以正常運作。

檢查已產生的程式碼

開啟 Controllers\MoviesController.csIndex 檔案並檢查產生的 方法。 使用 Index 方法的電影控制器部分如下所示。

public class MoviesController : Controller
{
    private MovieDBContext db = new MovieDBContext();

    // GET: /Movies/
    public ActionResult Index()
    {
        return View(db.Movies.ToList());
    }

Movies 控制器提出的要求傳回 Movies 表格的所有項目,然後將結果傳遞至 Index 檢視。 MoviesController類別的下一行會具現化電影資料庫內容,如前文所述。 您可以使用電影資料庫內容查詢、編輯和刪除電影。

private MovieDBContext db = new MovieDBContext();

強型別模型和 @model 關鍵字

稍早在本教學課程中,您已看到控制器如何使用 ViewBag 物件傳遞資料或物件給檢視範本。 ViewBag 是一種動態物件,提供便利的晚期繫結方式,將資訊傳遞至檢視。

MVC 也具備能力將型別模型物件傳遞至檢視範本。 這個強型別方法可讓您在 Visual Studio 編輯器中的編譯階段更妥善檢查程式碼,且提供更豐富的 IntelliSense。 Visual Studio 的 Scaffolding 機制在建立方法和檢視時,已使用此方法 (也就是傳遞型別模型) 來搭配 MoviesController 類別和檢視範本。

檢查 Controllers\MoviesController.cs 檔案產生的 Details 方法。 Details 方法顯示如下。

public ActionResult Details(int? id)
{
    if (id == null)
    {
        return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
    }
    Movie movie = db.Movies.Find(id);
    if (movie == null)
    {
        return HttpNotFound();
    }
    return View(movie);
}

id 參數通常會以路由資料的形式來傳遞,例如 http://localhost:1234/movies/details/1 會將控制器設為電影控制器、將動作設為 details,並將 id 設為 1。 您也可以在 ID 中使用查詢字串傳遞,如下所示:

http://localhost:1234/movies/details?id=1

如果找到 Movie,則 Movie 模型的執行個體會傳遞至 Details 檢視:

return View(movie);

檢查 Views\Movies\Details.cshtml 檔案的內容:

@model MvcMovie.Models.Movie

@{
    ViewBag.Title = "Details";
}

<h2>Details</h2>

<div>
    <h4>Movie</h4>
<hr />
    <dl class="dl-horizontal">
        <dt>
            @Html.DisplayNameFor(model => model.Title)
        </dt>
         @*Markup omitted for clarity.*@        
    </dl>
</div>
<p>
    @Html.ActionLink("Edit", "Edit", new { id = Model.ID }) |
    @Html.ActionLink("Back to List", "Index")
</p>

藉由在檢視範本檔案的最上方加入 @model 陳述式,您可以指定檢視所需的物件類型。 當您建立電影控制器時,Visual Studio 會在 Details.cshtml 檔案的最上方自動包含下列 @model 陳述式:

@model MvcMovie.Models.Movie

這個 @model 指示詞可讓您使用強型別的 Model 物件,存取控制器傳遞至檢視的電影。 舉例來說,在 Details.cshtml 範本中,程式碼會使用強型別的 Model 物件,將每個電影欄位傳遞至 DisplayNameForDisplayFor HTML 協助程式。 CreateEdit 方法與檢視範本也會傳遞電影模型物件。

檢查 MoviesController.cs 檔案中的 Index.cshtml 檢視範本和 Index 方法。 請注意程式碼在呼叫 Index 動作方法的 View 協助程式方法時會如何建立 List 物件。 此程式碼接著會從 Index 動作方法將 Movies 清單傳遞至檢視:

public ActionResult Index()
{
    return View(db.Movies.ToList());
}

在您建立電影控制器時,Visual Studio 會在 Index.cshtml 檔案的最上方自動加入下列 @model 陳述式:

@model IEnumerable<MvcMovie.Models.Movie>

@model 指示詞可讓您使用強型別的 Model 物件存取控制器傳遞至檢視的電影清單。 舉例來說,在 Index.cshtml 檢視範本中,程式碼會藉由透過強型別 Model 物件執行 foreach 陳述式來循環存取電影:

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Title)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.ReleaseDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Genre)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Price)
        </td>
         <th>
            @Html.DisplayFor(modelItem => item.Rating)
        </th>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
            @Html.ActionLink("Details", "Details", new { id=item.ID })  |
            @Html.ActionLink("Delete", "Delete", new { id=item.ID }) 
        </td>
    </tr>
}

因為 Model 物件是強型別 (以 IEnumerable<Movie> 物件形式),所以迴圈中每個 item 物件的型別為 Movie。 除了其他多種優勢之外,這也意味著您可以在程式碼編輯器的編譯階段檢查程式碼,並且取得完整的 IntelliSense 支援:

ModelIntelliSense

使用 SQL Server LocalDB

Entity Framework Code First 偵測到它取得的資料庫連結字串指向尚未存在的 Movies 資料庫,因此 Code First 會自動建立資料庫。 您可以查看 App_Data 資料夾,確認它是否已建立。 如果您沒有看到 Movies.mdf 檔案,請按一下「方案總管」工具列的 [顯示所有檔案] 按鈕,按一下 [重新整理] 按鈕,然後展開「App_Data」資料夾。

螢幕擷取畫面所示為方案總管視窗。App Data 資料夾和 Movies.mdf 子資料夾以紅色圈選。

按兩下Movies.mdf 開啟「伺服器總管」,然後展開「Tables」資料夾以查看 Movies 表格。 請注意 ID 旁的索引鍵圖示。 根據預設,EF 會將名為 ID 的屬性設為主索引鍵。 如需 EF 和 MVC 的詳細資訊,請參閱 Tom Dykstra 為 MVC 和 EF 設計的優秀教學課程。

DB_explorer

以滑鼠右鍵按鍵一下 Movies 表格,然後選取 [顯示表格資料] 查看您建立的資料。

螢幕擷取畫面所示為伺服器總管視窗。「Movies」的右鍵功能表開啟,[顯示表格資料] 已選取,並以紅色圈選。

螢幕擷取畫面所示為 MVC Movie Microsoft Visual Studio 視窗。其中 [dbo.MoviesData] 索引標籤已選取。

以滑鼠右鍵按一下 Movies 表格,然後選取 [開啟表格定義],以便查看 Entity Framework Code First 為您建立的表格結構。

螢幕擷取畫面所示為伺服器總管視窗。「Movies」的右鍵功能表開啟,[開啟表格定義] 已選取,並以紅色圈選。

螢幕擷取畫面所示為 MVC Movie Microsoft Visual Studio 視窗。其中 [dbo.MoviesDesign] 索引標籤已選取。

請注意 Movies 表格的結構描述如何對應至您稍早建立的 Movie 類別。 Entity Framework Code First 會根據您的 Movie 類別自動為您建立此結構描述。

完成時,以滑鼠右鍵按一下 [MovieDBContext] 並選取 [關閉連線],藉此關閉連線。 (如果您未關閉連線,下次執行專案時可能會發生錯誤。)

螢幕擷取畫面所示為伺服器總管視窗。[MovieDBContext] 的右鍵功能表開啟,其中 [關閉連線] 已選取,並以紅色圈選。

您現在擁有一個資料庫和多個頁面,可用來顯示、編輯、更新和刪除資料。 在下個教學課程中,我們會檢視其餘的架構程式碼,並新增 SearchIndex 方法與 SearchIndex 檢視,讓您在此資料庫搜尋電影。 如需詳細了解如何搭配 MVC 使用 Entity Framework,請參閱為 ASP.NET MVC 應用程式的建立 Entity Framework 資料模型