Доступ к элементу в $ .each ()

Question

Я пытаюсь использовать ajax для извлечения элементов корзины с сервера, чтобы показать их внутри корзины, когда клиент нажимает кнопку «Моя корзина».Модель для корзины:

public class Cart
    {
        [Key]
        public int RecordID { get; set; }
        public string CartID { get; set; }
        public int ItemID { get; set; }
        public int Count { get; set; }
        public int ItemPrice { get; set; }
        public System.DateTime DateCreated { get; set; }
        public virtual Item item { get; set; }
    }

Ниже приводится модель для элемента:

public class Item
{
    [Key]
    public int ItemID { get; set; }
    public virtual Category Category { get; set; }
    public virtual Brand Brand { get; set; }
    public int CategoryID { get; set; } //Category ID
    public int BrandID { get; set; }
    public string ItemCode { get; set; }
    public string ItemName { get; set; }
    public string BrandName { get; set; }
    public string CategoryName { get; set; }
    public string SubCategoryName { get; set; }
    public string FurtherCategoryName { get; set; }
    public int? ItemPrice { get; set; }
    [DataType(DataType.ImageUrl)]
    public string ImageUrl { get; set; } 
}

Этот код в представлении используется для извлечения элементов корзины с сервера:

$("#cartLi")
    .click(function () {
        $.post("/ShoppingCart/cartDropDown",
            function (data) {
                if (data.ItemCount == 0) {
                    $('.no-items').text(data.Message);
                    $('.noItemsInCart').css('display', 'inline-block');
                }
                else {
                    $.each(data.CartItems, function () {
                        //how to relate to every `ItemName` in the cartItems to set text of a <p> element inside the cart div. 
                    }
                    )
                }
            })
    });

cartDropDown() выглядит следующим образом:

[HttpPost]
    public ActionResult cartDropDown()
    {
        var cart = ShoppingCart.GetCart(this.HttpContext);
        // Set up list of cart items with total value
        var viewModel = new ShoppingCartViewModel
        {
            CartItems = cart.GetCartItems(),
            CartTotal = cart.GetTotal(),
            ItemCount = cart.GetCount(),
            Message = Server.HtmlEncode("There are no items in your cart. Continue shopping.")
        };
        foreach (var item in viewModel.CartItems)
        {
            item.item = db.Items.Single(i => i.ItemID == item.ItemID);
        }
        return Json(viewModel);
    }

Все работает, как ожидалось, т.е. если в корзине 4 товара, они успешно извлекаются с сервера с помощью вышеуказанного кода,Просто не могу понять, как мне нужно относиться к этим элементам один за другим в возвращаемой функции ajax.

Может кто-нибудь, пожалуйста, руководство.Спасибо

Answer 1

Вы должны поместить индекс параметра и элемент для метода .each.

$.each(data.CartItems, function (index, item) {
    let price = item.ItemPrice;
    let brand = item.item.BrandName;
    let itemname = item.item.ItemName;
    // append p tag here
    $(".cartdiv").append('<p>' + itemname + '</p>');
});