How to display list object to a view in ASP.Net MVC?

Question

I'm having a hard time displaying the values from a list object model to the view.

I've tried to display it using this code

@model IEnumerable<MVC.Models.RootObject>

@foreach (var item in @Model)
{
    <li>@item.records</li>
} 

But it shows an error

The model item passed into the dictionary is of type 'MVC.Models.RootObject', but this dictionary requires a model item of type 'System.Collections.Generic.IEnumerable`1[MVC.Models.RootObject]'.

Here is my controller that I used to pass data from model to view

           var transno = "ST-100420190001";

            var client = new HttpClient();
            var httpRequestMessage = new HttpRequestMessage
            {
                Method = HttpMethod.Get,
                RequestUri = new Uri("https://myurl.com/" + transno),
                Headers = {
                { HttpRequestHeader.Accept.ToString(), "application/json" },
                { HttpRequestHeader.ContentType.ToString(), "application/json"},
                { "client-id", "client_id"},
                { "client-secret","client_secret"},
                { "partner-id","partner_id"},
                { "X-Version", "1" }
            }
            };

            var response = client.SendAsync(httpRequestMessage).Result;
            RootObject obj = JsonConvert.DeserializeObject<RootObject>(await 
            response.Content.ReadAsStringAsync());

            return View(obj);

The RootObject model looks like this

public class RootObject
    {
        public List<Record> records { get; set; }
        public int totalRecords { get; set; }
    }

Then the Record model looks like this

 public class Record
    {
        public string transferId { get; set; }
        public string type { get; set; }
        public DateTime createdAt { get; set; }
        public string dateUpdated { get; set; }
        public string state { get; set; }
        public string senderTransferId { get; set; }
    }

Answer 1

As per my comment, you want to change the @model line and potentially flesh out the loop as follows.

@model MVC.Models.RootObject

@foreach (var item in @Model.records)
{
    <li>@item.transferId</li>
    <li>@item.type</li>
    // etc
} 

Answer 2

Okay let's have a look at the error message

Your view is expecting IEnumerable of RootObject , but you're just passing in a single RootObject.

The model item passed into the dictionary is of type 'MVC.Models.RootObject', but this dictionary requires a model item of type 'System.Collections.Generic.IEnumerable`1[MVC.Models.RootObject]'.

I'm not sure what your API is replying with, but you may need to DeserializeObject to an IEnumerable of RootObject instead of a single object. have you tried debugging these lines?

var response = client.SendAsync(httpRequestMessage).Result;
RootObject obj = JsonConvert.DeserializeObject<RootObject>(await response.Content.ReadAsStringAsync());

return View(obj);

If this is not the case and you're looking to make multiple API calls to build a list at a later date

Something like this should work, but I'd recommend following the above as it seems like more what you're looking for, judging by the razor you posted.

var response = client.SendAsync(httpRequestMessage).Result;
RootObject obj = JsonConvert.DeserializeObject<RootObject>(await 
response.Content.ReadAsStringAsync());

IEnumerable<RootObject> list = new List<RootObject>(){ obj };

return View(list);