如何在JS字符串变量（即javascript插值）中查找JS每个函数的输出

Question

对于上下文， gon.jbuilder是一个嵌套的JSON，它表示lenders与其inventories之间的has_many关系。

gon.jbuilder = [
  {
     "name": "John Doe", 
     "age": 29,
     "inventories": [
        {"id": 1, "name": "nail"},
        {"id": 2, "name": "hammer"},
        ...
     ]
  },
  {
     "name": "Jane Smith", 
     "age": 31,
     "inventories": [
        {"id": 3, "name": "picture"},
        {"id": 4, "name": "frame"},
        ...
     ]
  }
]

我正在使用Google Maps API为每个lender标记，然后在信息窗口中为每个lender显示他/她的所有inventories 。 这需要在信息窗口的内容内进行each循环，而我不知道该怎么做。 我需要这样的东西：

$.each( gon.jbuilder, function (counter, lender) { 
   // draw the marker for each lender
   // establish an info window for each lender

   // below per Google API docs should be the content that goes into the info window, not sure how to interpolate the each correctly
      var contentString = '<div id="content">'+
        '<div id="siteNotice">'+
        '</div>'+
        '<h1 id="firstHeading" class="firstHeading">'+ lender.name + '</h1>'+
        '<div id="bodyContent">'+
        '<ul>' +
        $.each( lender, function (counter, inventory) {
          '<li>' + inventory.name + '</li'>
        }; + 
        '</ul>' +
        '</div>'+
        '</div>';

谢谢！

Answer 1

$.each返回您迭代的对象，而不是$.each返回的对象。 另外，您的函数不返回任何内容-它执行串联，但不返回它。

您可以使用$.map ，它以数组的形式返回所有结果，然后使用.join将它们连接成一个字符串。

  var contentString = '<div id="content">'+
    '<div id="siteNotice">'+
    '</div>'+
    '<h1 id="firstHeading" class="firstHeading">'+ lender.name + '</h1>'+
    '<div id="bodyContent">'+
    '<ul>' +
    $.map( lender.inventories, function (inventory, counter) {
      return '<li>' + inventory.name + '</li>';
    }).join('') + 
    '</ul>' +
    '</div>'+
    '</div>';