ViewModel無法正常工作。從兩個表中顯示

Question

我試圖用視圖模型查看視圖中兩個表中的信息，但它不起作用。

這給出了兩個表的信息。

public class HeatImage 
{ 
    [Key] 
    public int ImageId { get; set; } 
    public string name { get; set; } 
} 

public class HeatingArea 
{ 
    [Key] 
    public int ID { get; set; } 
    public string Area { get; set; } 

} 

我的視圖模型

public class HeatingAreaViewModel 
{ 
    public IEnumerable<HeatImage> heatingImage { get; set; } 
    public IEnumerable<HeatingArea> heatingArea { get; set; } 
} 

我控制器

public ActionResult Index() 
     { 
      HeatingAreaViewModel mymodel = new HeatingAreaViewModel(); 
      mymodel.heatingArea = db.HeatingAreas.ToList(); 
      mymodel.heatingImage = db.HeatImages.ToList(); 

      return View(mymodel); 
     } 

而且我認爲

@model IEnumerable<Project.Models.HeatingAreaViewModel> 
@foreach (var item in Model) 
      { 
       <a href="~/folder/@item.heatingImage">@item.heatingArea</a> 
      } 

錯誤

傳遞到詞典中的模型項的類型 「Project.Models.HeatingAreaViewModel」的，但是這需要字典類型 的 模型項「System.Collections.Generic.IEnumerable`1 [Project.Models.HeatingAreaViewModel] 」。

Answer 1

您的看法期待一個IEAumerable的HeatingAreaViewModel，它看起來好像你只傳遞一個實例。

更改此

@model IEnumerable<Project.Models.HeatingAreaViewModel> 

這個

@model Project.Models.HeatingAreaViewModel 

然後你就可以遍歷heatingArea和heatingImage這類似

@foreach (var item in model.heatingArea) 
{ 
    //what ever you need to do here 
} 

Answer 2

錯誤消息告訴它：該視圖預計的，而您的控制器操作只發送到視圖HeatingAreaViewModel。

因此，要麼糾正控制器發送一個HeatingAreaViewModel列表，或更正視圖，以期望只有一個實例HeatingAreaViewModel。

Answer 3

如果你的問題是，如何在一個循環中通過HeatingImage和HeatingArea兩個列表迭代，在你看來，你必須重做視圖模型：

public class HeatingAreaViewModel 
{ 
    public HeatImage heatingImage { get; set; } 
    public HeatingArea heatingArea { get; set; } 
} 

，然後控制器動作：

public ActionResult Index() 
      { 
       heatingAreas = db.HeatingAreas.ToList(); 
       heatingImages = db.HeatImages.ToList(); 

       List<HeatingAreaViewModel> myModel = heatingAreas.Zip(heatingImages, (a, b) => new HeatingAreaViewModel {HeatingArea = a, HeatImage = b}) 

       return View(mymodel); 
      } 

然後，視圖將照原樣工作。

但是，我強烈建議不要這樣做。您必須確保兩個列表中的相應元素實際上相互對應。這很容易出錯。如果有一個將這兩個列表綁定在一起的底層邏輯（數據庫表格上有一些關係），我將使用該邏輯將列表/表格連接在一起。

Answer 4

只需將您的視圖模型不符合您的控制器操作發送的內容，所以我認爲你需要改變你的看法是這樣的：

@model HeatingAreaViewModel 
@foreach (var item in Model.heatingImage) 
{ 
    <a href="~/folder/@item.heatingImage">@item.heatingArea</a> 
} 

Answer 5

您通過appels並期待橘子發送，這就是你得到錯誤的原因。

在您的控制器中，您通過一個（一個）HeatingAreaViewModel實例發送。在您看來，您正在爲除了HeatingAreaViewModel實例（超過1個）的列表作出規定。

閱讀您希望在每次循環迭代中使用HeatImage和HeatingArea的回覆。您將需要更改視圖模型以適應此情況。例如，創建一個可以同時容納一個視圖模型：

public class HeatViewModel 
{ 
    public HeatImage HeatImage { get; set; } 

    public HeatingArea HeatingArea { get; set; } 
} 

您將通過此HeatViewModel的列表視圖。

public ActionResult Index() 
{ 
    // This is just dummy code 
    HeatingViewModel model1 = new HeatingAreaViewModel(); 
    // Populate the properties 
    model1.HeatImage = new HeatImage(); 
    // Populate the properties 
    model1.HeatingArea = new HeatingArea(); 

    HeatingViewModel model2 = new HeatingAreaViewModel(); 
    // Populate the properties 
    model2.HeatImage = new HeatImage(); 
    // Populate the properties 
    model2.HeatingArea = new HeatingArea(); 

    // Now pass this list to the view 
    List<HeatingViewModel> models = new List<HeatingViewModel>(); 

    return View(models); 
} 

您認爲您的代碼會是這個樣子：

@model List<Project.Models.HeatingViewModel> 
@foreach (var item in Model) 
{ 
    <p>item.HeatImage.Name</p> 
    <p>item.HeatingArea.ID (I have used ID because I don't know what your Area looks like)</p> 
} 

這種方式，你有一個循環的兩個對象。你只需要去弄清楚你將如何填充它們，這是大部分工作將完成的地方。

我還注意到，你以小寫字母開始你的屬性，最佳做法是用大寫字母開頭。例如：

public HeatImage heatImage { get; set; } 

...應該是...

public HeatImage HeatImage { get; set; } 

我希望這有助於:)