前言：
在本篇 Taurus.MVC WebMVC 入門開發教程的第四篇文章中，
我們將學習如何實現數據列表的綁定，通過使用 List<Model> 來展示多個數據項。
我們將繼續使用 Taurus.Mvc 命名空間，同時探討如何在視圖中綁定並顯示一個 Model 列表。
步驟1：創建 Model
首先，我們需要更新我們的 Model 類，使其能夠表示多個數據項。
我們可以繼續沿用之前的 User 類，不過這次我們將創建一個包含多個 User 對象的列表。
public class User { public string Name { get; set; } public int Age { get; set; } }
步驟2：更新控制器
接下來，我們需要更新控制器以支持傳遞包含多個 User 對象的列表到視圖中。
在 HomeController.cs 文件中，修改 Index 方法來創建一個包含多個 User 對象的列表，並傳遞給視圖。
public class HomeController : Taurus.Mvc.Controller { public void Index() { List<User> userList = new List<User> { new User { Name = "Alice", Age = 25 }, new User { Name = "Bob", Age = 30 }, new User { Name = "Charlie", Age = 28 } }; View.SetForeach(userList, "list"); } }
我們通過 View 的 SetForeach 方法，來接收列表數據，並同時進行界面渲染。
同時，我們在SetForeach的第二個方法中，指定界面元素的ID，以便我們知道要渲染的是哪個節點。
步驟3：更新視圖
現在，我們需要更新視圖來顯示列表中的每個 User 對象的信息。
在 Index.html 視圖文件中，我們可以通過設定ID，並被代碼端使用循環來遍歷列表，並顯示每個 User 對象的姓名和年齡。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>歡迎來到 Taurus.MVC WebMVC</title> </head> <body> <h1>用戶列表</h1> <ul id="list"> <li>姓名：${Name}，年齡：${Age}</li> </ul> </body> </html>
在上述代碼中，我們使用 同樣使用 ${modelName} CMS 指令來綁定列表數據。
綁定使用的是視圖所使用的 Model，其 類型爲 List<User>。
然後，通過節點 id 傳遞到控制器中循環遍歷列表中的每個 User 對象，並顯示其姓名和年齡。
其循環的內容爲id節點的內部文本，因此以下代碼將被循環多次並進行替換：
<li>姓名：${Name}，年齡：${Age}</li>
步驟4：運行應用程序
最後，運行應用程序並查看頁面的呈現效果。
您將看到一個包含多個用戶信息的列表被成功顯示在頁面上。
步驟5：循環嵌套的調用方式
有時候，界面可能涉及循環嵌套，以實現嵌套的結果。
例如：框架後臺管理中的 Extend Menu 就用到了這個手法。
界面Html如：
<div id="menuList"> <div style="float:left"><b>${0} ：</b></div> <div name="hostList" style="float:left"> <a target="frame" href="${HostUrl}">${HostName}</a> | </div> <div style="clear:both;height:5px;"> </div> </div>
一級節點：MenuList 爲一級循環，其內部文本 ${0} 綁定標題。
說明：${0} 用來綁定分類標題，${Model} 語法，也可以根據索引來綁定數據。
二級節點：hostList 爲二級循環，其內部文件有多個綁定項：${HostUrl} 和 ${HostName}
對於這種循環嵌套，對新手來手，是需要多習練習適應的。
這裏我們看框架內部是怎麼實現的：
internal partial class AdminController { #region 頁面呈現 private MDataTable menuTable; /// <summary> /// Ext - Menu 展示 /// </summary> public void Menu() { menuTable = new MDataTable(); menuTable.Columns.Add("MenuName,HostName,HostUrl"); MDataTable dtGroup = new MDataTable(); dtGroup.Columns.Add("MenuName"); List<string> groupNames = new List<string>(); #region 加載自定義菜單 ......省略代碼...... #endregion View.OnForeach += View_OnForeach_Menu; dtGroup.Bind(View, "menuList"); } private string View_OnForeach_Menu(string text, MDictionary<string, string> values, int rowIndex) { string menu = values["MenuName"]; if (!string.IsNullOrEmpty(menu)) { //循環嵌套：1-獲取子數據 MDataTable dt = menuTable.FindAll("MenuName='" + menu + "'"); if (dt != null && dt.Rows.Count > 0) { //循環嵌套：2 - 轉爲節點 XmlNode xmlNode = View.CreateNode("div", text); //循環嵌套：3 - 獲取子節點，以便進行循環 XmlNode hostNode = View.Get("hostList", xmlNode); if (hostNode != null) { //循環嵌套：4 - 子節點，循環綁定數據。 View.SetForeach(dt, hostNode, hostNode.InnerXml, null); //循環嵌套：5 - 返回整個節點的內容。 return xmlNode.InnerXml; } } } return text; } #endregion }
最後，運行應用程序並查看頁面的呈現效果。
您將看到一個包含一級標題和多個二級標題列表被成功顯示在頁面上。
總結
通過本篇教程，我們學習瞭如何在 Taurus.MVC WebMVC 中實現數據列表的綁定，使用 List<Model> 來展示多個數據項。
我們更新了 Model 類、控制器和視圖，成功實現了一個簡單的數據列表綁定示例。
本系列的目錄大綱爲：
Taurus.MVC WebMVC 入門開發教程1：框架下載環境配置與運行 Taurus.MVC WebMVC 入門開發教程2：一個簡單的頁面呈現 Taurus.MVC WebMVC 入門開發教程3：數據綁定Model Taurus.MVC WebMVC 入門開發教程4：數據列表綁定List<Model> Taurus.MVC WebMVC 入門開發教程5：表單提交與數據驗證 Taurus.MVC WebMVC 入門開發教程6：路由配置與路由映射 Taurus.MVC WebMVC 入門開發教程7：部分視圖和頁面片段