this call is ambiguous between the following methods or properties when using 2 models in a view c# razor

Question

I am having trouble using 2 models in a view in mvc. When I try to reference the second model using razor it is giving me this error:

The call is ambiguous between the following methods or properties: 'System.Web.Mvc
.Html.DisplayNameExtensions.DisplayNameFor<System.Collections.Generic.IEnumerable
<MyApp.Models.Problems>, string>(System.Web.Mvc.HtmlHelper<System.Collections.
`Generic.IEnumerable<MyApp.Models.Problems>`(System.Linq.Expressions.Expression
<System.Func<System.Collections.Generic.IEnumerable<MyApp.Models.Problems>,
string>>)' and 'System.Web.Mvc.Html.DisplayNameExtensions.DisplayNameFor<MyApp
.Models.Problems>,string(System.Web.Mvc.HtmlHelper<Systems.Collections.Generic
.IEnumerable<MyApp.Models.Problems>>(System.Linq.Expressions.Expression<System.Func
<MyApp.Models.Problems>,string>>

This is how I call the model in the view:

@model IEnumerable<MyApp.Models.Problems>

This is my model being loaded in the view:

public class Problems
{
  public int Id { get; set; }
  public string Title { get; set; }

  public IEnumerable<MyApp.Models.Category> Categories { get; set; }
  public IEnumerable<MyApp.Models.Type> Types {get; set;}
}

These are the other 2 models inside that model:

public partial class Category
{
   public int Id { get; set; }
   public string Title { get; set; }
}

public partial class Type
{
  public int Id { get; set; }
  public int Order { get; set; }
  public string Description { get; set; }
}

And this is how I am trying to call the model inside of the problems model using razor:

@foreach(Problems problems in Model)
{
   foreach(Category category in problems.Categories)
   {
      @Html.DisplayNameFor(cat => @category.Title)
   }            
}

There error I am getting is on this line:

@Html.DisplayNameFor(cat => @category.Title)

Any help for me to solve this problem would be amazing, I've spent a lot of time researching and can't seem to find the proper solution. Thank you in advance!

Edit to add controller:

So what happens is a button is clicked and I am trying to populate a modal with the razor information.

This is what I am using in the controller:

using System.Data;
using System.Data.Entity;
using System.Linq;
using System.Net;
using System.Web;
using System.Web.Mvc;
using MyApp.DTOs;
using MyApp.Models;

    public class ProblemController : BaseController
        {
            private Context db = new Context();
        }

This is the button that kicks off the java script to create the modal I am trying to add it to(It bring in the Problem Id to the modal):

<button class="modal" value= @item.Id role="button">Add Problem</button>

Along with my javascript for the modal being created:

<script>
    $(function () {
        $("#myModal").dialog({
            autoOpen: false,
            height: 600,
            width: 500,
            modal: true,
            open: function () {
                $("#accordion").accordion({ autoHeight: true });
            }
        });
        $(".modal").click(function () {
            defectId.value = $(this).attr('value');
            $("#myModal").dialog("open");
        })
    });
</script>

When The form is submitted in the modal it sends in hardcoded radio buttons values to my controller to this method:

[HttpPost]
public ActionResult AddProblem(Problems model)
{
     List<Category> c = db.Categories.ToList();
     List<Type> t = db.Types.ToList();

     return View();
}

This is my get method when the page is loaded:

public ActionResult GetProblem(ProjectProblemVM item)
        {
            var userid = getUserId();
            var userKey = getApiKey();

            // return problems
            var requestProb = new RestRequest("problem", Method.GET);
            requestProb.AddHeader("id", userid);
            requestProb.AddHeader("key", userKey);
            requestProb.RequestFormat = DataFormat.Json;
            var responseProb = Host.Execute(requestProb) as RestResponse;

            List<Problems> problems = JsonConvert.DeserializeObject<List<Problems>>(responseProb.Content);
            IEnumerable<Problems> problemsToReturn = problems.Where(d => d.ProjectId == item.ProjectId);

            return View(problemsToReturn);
        }

Answer 1

change this line:

@Html.DisplayNameFor(cat => @category.Title)

to

@Html.DisplayNameFor(cat => category.Title)

Update

You need also to configure well your relations one to many on all your models.

This is my model being loaded in the view:

public class Problems
{

  public Problems()
    {
        Categories = new List<MyApp.Models.Category>();
        Types = new List<MyApp.Models.Type>();
    }
 public int ProblemId { get; set; }
 public string Title { get; set; }

 public IEnumerable<MyApp.Models.Category> Categories { get; set; }
 public IEnumerable<MyApp.Models.Type> Types {get; set;}
}

These are the other 2 models inside that model:

public partial class Category
{
 public int CategoryId { get; set; }
 public string Title { get; set; }

 public virtual MyApp.Models.Problems Problem { get; set; }//Add this line to respect the one-many config
}

public partial class Type
{
public int TypeId { get; set; }
public int Order { get; set; }
public string Description { get; set; }

public virtual MyApp.Models.Problems Problem { get; set; }//Add this line to respect the one-many config
}

Source:configure-one-to-many-relationship-in-code-first