共用方式為


使用檢視範本從控制器存取模型的數據

Rick Anderson

注意

這裡提供本教學課程的更新版本,其中使用 ASP.NET MVC 5 和 Visual Studio 2013。 新的教學指示更安全、更易於遵循且示範更多功能。

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

在繼續進行下個步驟之前,請先建置應用程式

以滑鼠右鍵按一下 Controllers 資料夾,然後建立新的 MoviesController 控制器。 在您建置應用程式之前,將不會顯示下列選項。 選取下列選項:

  • 控制器名稱:MoviesController。 (這是預設值)。
  • 範本: 使用 Entity Framework 搭配讀取/寫入動作和檢視的MVC控制器。
  • 模型類別:Movie (MvcMovie.Models)
  • 資料內容類別:MovieDBContext (MvcMovie.Models)
  • 檢視:Razor (CSHTML)。 (預設值)。

AddScaffoldedMovieController

按一下新增。 Visual Studio Express 會建立下列檔案和資料夾:

  • 一個「MoviesController.cs」檔案 (在專案的 Controllers 資料夾中)。
  • 一個「Movies」資料夾 (在專案的 Views 資料夾中)
  • 「Create.cshtml」、「Delete.cshtml」、「Details.cshtml」、「Edit.cshtml」和「Index.cshtml」(在新的 Views\Movies 資料夾中)。

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

執行應用程式並瀏覽至 Movies 控制器,方法是將 /Movies 附加到瀏覽器網址列中的 URL。 由於應用程式仰賴預設的路由 (在「Global.asax」 檔案中定義),因此瀏覽器要求 http://localhost:xxxxx/Movies 會路由至 Movies 控制器預設的 Index 動作方法。 換句話說,瀏覽器要求 http://localhost:xxxxx/Movies 基本上與瀏覽器要求 http://localhost:xxxxx/Movies/Index 相同。 取得的結果是空白電影清單,因為您尚未新增任何電影。

顯示 M V C 電影索引頁面的螢幕快照。

建立電影

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

顯示 M V C 電影建立頁面的螢幕快照。

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

IndexWhenHarryMet

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

檢查已產生的程式碼

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

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

    //
    // GET: /Movies/

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

MoviesController 類別的下一行會具現化電影資料庫內容,如前文所述。 您可以使用電影資料庫內容查詢、編輯和刪除電影。

private MovieDBContext db = new MovieDBContext();

Movies 控制器提出的要求,傳回了電影資料庫中 Movies 資料表的所有項目,然後將結果傳遞至 Index 檢視。

強型別模型和 @model 關鍵字

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

ASP.NET MVC 也能將強型別資料或物件傳遞至檢視範本。 這個強型別方法可讓您在 Visual Studio 編輯器中的編譯階段更妥善檢查程式碼,且提供更豐富的 IntelliSense。 Visual Studio 中的 Scaffolding 機制在建立方法和檢視時,會搭配 MoviesController 類別和檢視範本使用此方法。

檢查 Controllers\MoviesController.cs 檔案產生的 Details 方法。 使用 Details 方法的電影控制器部分如下所示。

public ActionResult Details(int id = 0)
{
    Movie movie = db.Movies.Find(id);
    if (movie == null)
    {
        return HttpNotFound();
    }
    return View(movie);
}

Movie如果找到 ,模型Movie實例會傳遞至 [詳細數據] 檢視。 檢查 Views\Movies\Details.cshtml 檔案的內容

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

@model MvcMovie.Models.Movie

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

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

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

當您建立電影控制器時,Visual Studio Express 會自動在 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", { id=item.ID })  |
            @Html.ActionLink("Delete", "Delete", { 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」資料夾。

顯示 [方案總管] 視窗的螢幕快照。[顯示所有檔案] 圖示會以紅色圓形,並選取 [應用程式數據] 資料夾。

按兩下 Movies.mdf 開啟 [資料庫總管],然後展開 [資料表 ] 資料夾以查看Movies資料表。

DB_explorer

注意

如果資料庫總管未出現,請從 [工具] 功能選取 [ 連接到資料庫],然後取消 [ 選擇數據源 ] 對話方塊。 這會強制開啟資料庫總管。

注意

如果您使用 VWD 或 Visual Studio 2010,並收到類似下列任一項的錯誤:

  • 資料庫 'C:\Webs\MVC4\MVCMOVIE\MVCMOVIE\APP_DATA\MOVIES。無法開啟 MDF,因為它是版本 706。 此伺服器支援 655 版和更早版本。 不支援降級路徑。
  • 「用戶程式代碼未處理 InvalidOperation 例外狀況」提供的 SqlConnection 未指定初始目錄。

您必須安裝 SQL Server Data ToolsLocalDB。 確認上MovieDBContext一頁指定的 連接字串。

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

顯示 [d b o 點電影數據] 索引標籤的螢幕快照。

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

顯示 [資料庫總管] 視窗的螢幕快照。在 [電影] 右鍵功能表中選取 [開啟數據表定義]。

顯示下方 d b 點電影索引標籤和 Entity Framework Code 的螢幕快照。

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

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

顯示 [資料庫總管] 視窗的螢幕快照。已選取 [電影 D B 內容] 右鍵功能表中的 [關閉連線]。

您現在已有資料庫,以及簡單的清單頁面可顯示內容。 在下個教學課程中,我們會介紹其餘的架構程式碼,並新增 SearchIndex 方法與 SearchIndex 檢視,讓您在此資料庫搜尋電影。