Отображение данных из нескольких моделей на одном представлении (изображения и текст)

Question

Привет всем, поэтому я пытаюсь создать приложение с использованием asp.net mvc с первой базой данных кода, которая позволяет пользователям создавать запись в блоге с помощью многие изображения по своему усмотрению. У меня есть данные, хранящиеся в базе данных, но в настоящее время я пытаюсь отобразить изображение головы, тела и изображений в представлении на экране, это то, что мне хотелось бы выглядеть так: http://imgur.com/a/IR19r, но я не уверен как это сделать. Я могу показать голову и тело, но не может получить изображения из таблицы изображений здесь является база данных схема: http://imgur.com/a/lvwti

В настоящее время это ошибка я получаю, когда я добавить это мнение @Html.DisplayFor(modelItem => item.Images)

Исключение типа «System.Data.Entity.Core.EntityCommandExecutionException» произошло в EntityFramework.SqlServer.dll, но не было обработано в коде пользователя

Дополнительная информация: Произошла ошибка при выполнении определения команды. Подробнее см. Внутреннее исключение.

Модель

public partial class PostModel 
{ 
    public PostModel() 
    { 
     Images = new List<ImageModel>(); 
    } 
    [Key] 
    [HiddenInput(DisplayValue = false)] 
    public int ID { get; set; } 
    [Required(ErrorMessage = "Heading is Required")] 
    [Display(Name = "Heading")] 
    public string Heading { get; set; } 
    [Required(ErrorMessage = "Body is Required")] 
    [DataType(DataType.MultilineText)] 
    [Display(Name = "Body")] 
    public string Body { get; set; } 
    public virtual ICollection<ImageModel> Images { get; set; } 
    public IEnumerable<HttpPostedFileBase> File { get; set; } 
} 

public class ImageModel 
{ 
    [Key] 
    public int ID { get; set; } 
    public string Path { get; set; } 
    public virtual PostModel Post { get; set; } 
    public string DisplayName { get; set; } 
} 
public class ImageVM 
{ 
    public int? ID { get; set; } 
    public string Path { get; set; } 
    public string DisplayName { get; set; } 
    public bool IsDeleted { get; set; } 
} 
public partial class PostVM 
{ 
    public PostVM() 
    { 
     Images = new List<ImageVM>(); 
    } 

    public int? ID { get; set; } 
    public string Heading { get; set; } 
    public string Body { get; set; } 
    public IEnumerable<HttpPostedFileBase> Files { get; set; } 
    public List<ImageVM> Images { get; set; } 

} 

DbContext

public class EFDbContext : DbContext 
{  
    public DbSet<PostModel> Posts { get; set; } 
    public DbSet<PostVM> PostVMs { get; set; } 
    public DbSet<ImageModel> Images { get; set; } 
    public DbSet<ImageVM> ImageVMs { get; set; } 
} 

Контроллер

public ViewResult Display() 
{ 
     return View(repository.Posts) 
    } 

Посмотреть

@model IEnumerable<Crud.Models.PostModel> 
@{ 
    ViewBag.Title = "Index"; 
} 


    @foreach (var item in Model) 
    { 
    <div> 
     @Html.DisplayFor(modelItem => item.Heading) 
    </div> 
    <div> 
     @Html.DisplayFor(modelItem => item.Body) 
    </div> 
    <div> 
     @Html.DisplayFor(modelItem => item.Images) 
     @*<img class="img-thumbnail" width="150" height="150" src="/Img/@item.Images" />*@ 
    </div> 

} 

Вот альтернативный контроллер я пытался, но я не использую, как я получил эту ошибку, когда я попытался позволить Images = i.Path и не был действительно уверен, что это должно было быть, как это было сделано

Не удается неявно преобразовать typeCrud ' строка»до 'System.Collections.Generic.List Crud.Models.ImageVm'

public ViewResult Display() 
     { 

      IEnumerable<PostVM> model = null; 
      model = (from p in db.Posts 
        join i in db.Images on p.ID equals i.Post 
        select new PostVM 
        { 
         ID = p.ID, 
         Heading = p.Heading, 
         Body = p.Body, 
         Images = i.Path 
        }); 
      return View(model); 
     } 

Answer 1

item.Images коллекция. Итак, проведите через это и покажите изображения.

<div> 
    @foreach(var image in item.Images) 
    { 
     <img src="@image.Path" /> 
    }  
</div> 

Вам необходимо внести изменения в src собственности в зависимости от того, что значение, которое вы храните в Path свойстве изображения.

Вы можете исправить другой способ действий, как этот

public ViewResult Display() 
{ 
    var posts = db.Posts.Select(d => new PostVM() 
    { 
     ID = d.ID , 
     Heading = d.Heading, 
     Body = d.Body, 
     Images = d.Images.Select(i => new ImageVM() { Path = i.Path, 
                 DisplayName = i.DisplayName } 
           ).ToList() 
    }).ToList(); 
    return View(posts); 
} 

Теперь, так как вы возвращаете список PostVM, убедитесь, что ваш вид дисплея сильно типизированных к этому.

@model List<PostVM> 
<h1>Posts</h1> 
@foreach(var p in Model) 
{ 
    <h3>@p.Heading</h3> 
    <p>@p.Body</p> 
    @foreach(var image in item.Images) 
    { 
    <img src="@image.Path" /> 
    } 
} 

Кроме того, нет смысла держать классы модели просмотра в контексте вашего db. Храните только свои модели сущностей. Представленные модели предназначены только для использования слоя пользовательского интерфейса.

public class EFDbContext : DbContext 
{  
    public DbSet<PostModel> Posts { get; set; } 
    public DbSet<ImageModel> Images { get; set; } 
}