asp.net MVC - 基于存储过程创建复杂视图



我正在修补一个 ASP.NET 的MVC 4模板,我需要有关如何设计复杂视图布局的指导。

我已经创建了一个模型,该模型正在获取由 SQL Server DB 中的存储过程返回的数据。视图正在从IEnumerable<>对象中的模型获取数据。如果要查看存储过程的原始输出,它将如下所示:

**Name**        **Objects**
John            Orange
John            Banana
John            Apple

我使用视图模板根据下面的逻辑创建了一个简单的表,但正如预期的那样,它的呈现方式与存储在IEnumerable<>对象中的完全相同。该名称显示在表中的每一行输出上,如上所示。

@model IEnumerable<projectname.Models.ObjectsModel>
<table class="table">
...
...
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.DisplayFor(modelItem => item.Objects)
</td>
...

相反,我想创建一个不是表格形式的视图布局,它将 Name 显示为标题,将对象显示为项目符号列表,并在其他地方显示其他属性,没有冗余数据。我的问题是,如果我使用@foreach (var item in Model)显示IEnumerable<>中的项目,我最终会得到三个重复的条目,因为Name字段中的值不是唯一的。

执行此操作的"最佳实践"方法是什么?有人可以指出我正确的方向吗?

不确定您的控制器是什么样子,甚至您的视图模型,但也许我可以为您指出正确的方向。

foreach只是对象的循环,应该用于此,我见过很多人操纵foreach循环很少或没有成功,你应该使用@for循环。 此外,for循环大约比foreach循环快2倍,因为它只需要为列表中的每个元素调用get_Item

有几种方法可以满足您想要的内容,一种方法是上面@colinD通过在控制器或视图模型中使用 LINQ 传递正确的数据来传递正确的数据。 另一种方式类似于以下内容。

var models = ObjectsModel();
var grouped = models.GroupBy(s => s.ObjectsModel.Name)
.Select(x => x.Select(y => y))
.ToList();
return View(grouped);
@for(int i = 0; i < Model.Count; i++)
{
<h2>@Html.DisplayFor(model => model[i].First().ObjectsModel.Name)</h2>
<ul>
for(int j = 0; j < Model[i].Count; j++)
{
<li>@Html.DisplayFor(model => model[i][j].Object)</li>
}
</ul>
}

我还没有测试过代码,但我希望这可以帮助您获得所需的正确解决方案。

我想弄清楚的主要事情是如何显示这些数据 无需生成@foreach(模型中的 var 项)循环 SP 输出中每一行的重复条目。

通常处理数据是在action中完成的,比如对数据进行分组,然后做一些循环来显示。由于你想避免@foreach我想使用 linq。这只是一个想法,但请记住,您应该在 MVC 中分离关注点。我希望这对;)有所帮助

IEnumerable<ObjectsModel> model = new List<ObjectsModel>()
{
new ObjectsModel(){ Name = "John", Objects = "Orange" },
new ObjectsModel(){ Name = "John", Objects = "Banana" },
new ObjectsModel(){ Name = "John", Objects = "Apple" }
};
var htmlModel = model
.GroupBy(a => a.Name)
.Select(a => new
{
Name = a.Key,
GroupObjects = string.Join("", a.Select(b => $"<li>{b.Objects}</li>"))
})
.Select(a => $"<h1>{a.Name}</h1><ul>{a.GroupObjects}</ul>")
.ToList();
var result = string.Join("", htmlModel); // <h1>John</h1><ul><li>Orange</li><li>Banana</li><li>Apple</li></ul>

最终结果:

<h1>John</h1>
<ul>
<li>Orange</li>
<li>Banana</li>
<li>Apple</li>
</ul>

最新更新