javascript - 无法在缩略图中显示来自 ajax 请求的数据

Question

我有下面的代码，由于某种原因，我无法替换var缩略图中的{photo}和{name}以及我数据库中的一些值。如果我尝试控制台记录值，我可以看到它们，但在前端我只得到一个 {name} 和默认图像图标，就像替换功能根本不起作用。我看不出这里有什么问题，有人可以解释一下吗？

var p = {};

var searchInput = $("#category").tagsinput('items');

var thumbnail = '<div class="col-lg-12">\
 <div class="thumbnail">\
   <img src="{photo}" alt="img">\
     <div class="caption">\
       <h4><a href="">{name}</h4>\
   </div>\
 </div>\
</div>';

$("#submit-search").on("click",function () {
var myJsonString = JSON.stringify(searchInput.itemsArray);
console.log(myJsonString);

$.ajax({
  "url":"search.php",
  "method":"POST",
  "cache":false,
  "data":{data:myJsonString}
}).done(function (sData) {



   p = JSON.parse(sData);
// console.log(p[0].name);

for (var i = 0; i < p.length; i++) {

  var rTemplate = thumbnail.replace("{{photo}}", p[i].photo).replace("{{name}}", p[i].name);
console.log(p[i].photo);
  $(".rContainer").append(rTemplate);
}


});
});

Answer 1

您正在使用 {var} 作为模板占位符，但您尝试使用 {{var}} 替换它们，这就是它不起作用的原因，请更改您的替换为:

thumbnail.replace("{photo}", p[i].photo).replace("{name}", p[i].name);