Question

我正在使用Laravel作为我的后端，并使用jQuery作为前端。我收到一个响应，该响应在主数组内的对象内部有一个数组（希望如此）。

这是我对象的一部分：

{
  "basket": [{
    "id": 17,
    "restaurant_id": 1,
    "table_id": 1,
    "item_id": 9,
    "item_language_id": 37,
    "price": "25.99",
    "qty": 1,
    "item": {
      "id": 9,
      "user_id": 1,
      "restaurant_id": 1,
      "category_id": 5,
      "name": "Grilled Beef with potatoes",
      "price": "25.99",
      "short_description": "Meat / Potatoes / Rice / Tomatoe",
      "itemlanguages": [{
        "id": 37,
        "user_id": 1,
        "item_id": 9,
        "lang_id": 9,
        "restaurant_id": 1,
        "category_id": 5,
        "category_language_id": 21,
        "name": "烤牛肉配土豆",
        "price": "MVR 25.99",
        "short_description": "肉/土豆/大米/西红柿",
        "description": "<p>test</p>"
      }]
    }
  }]
}

basket是一个数组。内部是一个item对象，该对象具有itemlanguages数组。我想遍历basket，但显示itemlaguages name，price等。不是从item开始。到目前为止，这是我尝试过的。

$.each(response.basket, function(index, val) {
  $.each(this.item.itemlanguages, function(index, val) {
    name = this.name;
    short_description = this.short_description;
  });

  var name = null;
  var short_description = null;
  var qty = this.qty;
  var price = this.price;

  $('<span>' + name + ' | ' + short_description + ' | ' + qty + ' | ' + price + '</span>').appendTo(basket);
});

尽管我可以通过先在each()上进行response.basket并在其中进行this.item.itemlanguages来迭代我通常的操作，但这没有用。我试图将值分配给变量。任何帮助表示赞赏。

Answer 1

问题是因为name和short_description是在$.each的{{1}}循环中定义的，因此不在外部itemlanguages的范围内您尝试使用它们。

要解决此问题，请将所有逻辑移到内部$.each中。另请注意，您可以使用$.each的第二个参数来引用循环中的当前实体，以使语法更易于理解（因为使用的$.each关键字较少）。试试这个：

this

var response = {
  "basket": [{
    // other properties...
    "price": "25.99",
    "qty": 1,
    "item": {
      // other properties...
      "itemlanguages": [{
        // other properties...
        "name": "烤牛肉配土豆",
        "short_description": "肉/土豆/大米/西红柿"
      }]
    }
  },{
    // other properties...
    "price": "999.00",
    "qty": 2,
    "item": {
      // other properties...
      "itemlanguages": [{
        // other properties...
        "name": "lorem ipsum dolor sit amet",
        "short_description": "lorem ipsum"
      }]
    }
  }]
}

var $basket = $('#basket');
$.each(response.basket, function(index, basket) {
  $.each(basket.item.itemlanguages, function(index, itemlanguage) {
    var name = itemlanguage.name;
    var short_description = itemlanguage.short_description;
    var qty = basket.qty;
    var price = basket.price;

    $('<span>' + name + ' | ' + short_description + ' | ' + qty + ' | ' + price + '</span>').appendTo($basket);
  });
});

span {
  display: block;
}

如何访问和遍历嵌套数组

1 个答案: