我正在尝试加载标签内部的部分视图,但它没有显示数据。
我正在使用以下代码我不能只使用razor代码进行循环这是在部分视图中我希望从另一个视图加载
@model IEnumerable<solitude.models.ProductImages>
@{
ViewData["Title"] = "ProductPicturesList";
Layout = "~/Views/Shared/_LoginAdminLte.cshtml";
}
<h2>ProductPicturesList</h2>
<table class="table">
<thead>
<tr>
<th>
Picture Title
</th>
<th>
Image
</th>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
</tr>
<td>
<a asp-action="Edit" asp-route-id="@item.ProductID">Edit</a> |
<a asp-action="Details" asp-route-id="@item.ProductID">Details</a> |
<a asp-action="Delete" asp-route-id="@item.ProductID">Delete</a>
</td>
}
</tbody>
</table>
它在主列表中的原因我正在使用视图模型,但我想在表单上方显示一个图片列表上面我最好的方法是这样做,因为它不会返回任何结果我正在使用控制器我的主页。
@model solitude.models.Models.ViewModels.ProductImageVm
@*
For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860
*@
@Html.PartialAsync("_ProductPicturesList.cshtml")
<div class="form-group">
<form asp-controller="Products" asp-action="FileUpload" asp-route-returnurl="@ViewData["ReturnUrl"]" enctype="multipart/form-data" method="post" class="form-horizontal" role="form">
<input asp-for="Title" />
<input asp-for="ProductId" type="hidden" />
<input asp-for="Image" />
<input type="submit" />
</form>
编辑2 我的产品图像应该更改
public class ProductImages
{
[Key]
public int ProductImageId { get; set; }
public int ProductID { get; set; }
public string ProductImageTitle { get; set; }
public string ProductImageUploadUrl { get; set; }
public string ProductImageRealPath { get; set; }
public string ServerIpAddress { get; set; }
public string ProductImageAltTag { get; set; }
public int DisplayOrder { get; set; }
public string Image { set; get; }
}
}
答案 0 :(得分:1)
您的部分视图强烈输入ProductImages
的集合。但是在主视图中调用此局部视图时,您不会将模型(这是ProductImage对象的集合)传递给此局部视图。如果您没有明确地传递模型,它将尝试将模型用于父视图。在您的情况下,您的父视图是强ProductImageVm
视图模型类。所以它没有加工部分视图所期望的东西。
解决方案是传递有效的ProductImages集合。如果您的视图模型具有该类型的集合属性,则可以执行该操作
@await Html.PartialAsync("_ProductPicturesList.cshtml",Model.Images)
假设Images
类型为IEnumerable<solitude.models.ProductImages>
理想情况下,将实体类与视图模型混合并不是一个好主意。所以我会为ProductImage局部视图创建一个视图模型类,并将其用作属性
public class ProductImg
{
public string Title { set;get;}
public string FileName { set;get;}
// or path as needed
}
public class EditProductImageVm
{
public string Title { set;get;} //for the new item
public IFormFile Image { set;get; } //for the new item
public IEnumerable<ProductImg> Images { set;get;}
}
现在确保主视图没有强烈输入到EditProductImageVm,并且您的部分视图强类型为IEnumerable<ProductImg>
。您还需要等待PartialAsync
方法
@model YourNameSpaceGoesHere.EditProductImageVm
<div>
@await Html.PartialAsync("_ProductPicturesList.cshtml",Model.Images);
</div>
<form asp-controller="Products" asp-action="FileUpload" enctype="multipart/form-data"
method="post" >
<input asp-for="Title" />
<input asp-for="Image" />
<input type="submit" />
</form>
你的部分观点将是
@model IEnumerable<YourNameSpaceGoesHere.ProductImg>
<h3>Images</h3>
<table class="table table-condensed table-bordered">
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
<td>
<!-- adjust the below img src path as needed -->
<img src="@Url.Content("~/uploads/"+item.FileName)"/>
</td>
</tr>
}
</table>