Partielle Ansicht lädt keine Daten

Question

Ich versuche eine Teilansicht innerhalb eines Tabs zu laden, aber es zeigt keine Daten an.

Ich verwende den folgenden Code kann ich nicht nur eine Schleife tun Rasierer Code dies in einer Teilansicht ist, die ich mag aus einer anderen Ansicht laden in

@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> 

Seine Ursache in der Hauptliste Ich bin Wenn ich ein Ansichtsmodell verwende, aber ich möchte eine Liste von Bildern über dem Formular anzeigen, was wäre meine beste Art dies zu tun, da es keine Ergebnisse zurückgibt. Ich benutze einen Controller für meine Hauptseite.

@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> 

Edit 2 Meine Produktbilder als Klasse sollen diese

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; } 

    } 
} 

Answer 1

Ihre Teilansicht getippt wird stark auf eine Sammlung von ProductImages geändert werden. In Ihrer Hauptansicht, wenn Sie diese Teilansicht aufrufen, übergeben Sie das Modell (also die Sammlung von ProductImage-Objekten) nicht an diese Teilansicht. Wenn Sie das Modell nicht explizit weitergeben, wird es versuchen, das Modell für die Elternansicht zu verwenden. In Ihrem Fall ist Ihre Elternansicht stark ProductImageVm Ansicht Modellklasse. Es geht also nicht darum, was die Teilansicht erwartet.

Die Lösung besteht darin, eine gültige Sammlung von ProductImages zu übergeben. Wenn Ihr View-Modell eine Sammlung Eigenschaft dieses Typs hat, können Sie das tun

@await Html.PartialAsync("_ProductPicturesList.cshtml",Model.Images) 

Unter der Annahme, Images vom Typ IEnumerable<solitude.models.ProductImages>

Ideal ist es keine gute Idee Entitätsklassen mit Blick Modellen zu mischen. So würde ich einen Blick Modellklasse für die Produktbild Teilansicht erstellen und verwenden, die als Eigentum

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;} 
} 

Jetzt sicher Hauptansicht machen, ist nicht stark typisiert zu EditProductImageVm und Ihre Teilansicht ist stark an IEnumerable<ProductImg> getippt. Darüber hinaus müssen Sie den Anruf PartialAsync Methode erwarten

@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> 

Und Ihre Teilansicht wird

@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>