У меня есть простой запрос ajax, возвращающий некоторые данные, а затем вставку в шаблонный литерал. Мне было интересно, можно ли вставить в шаблон выражение "if" внутри шаблона?
По существу, чтобы добавить дополнительную строку кода, если объект json имеет 5-й цвет.
$.ajax({
url: 'http://localhost:8888/ColourCatchr%202/app/search.php'
}).done(function(results){
var res = jQuery.parseJSON(results);
console.log(res);
$.each(res,function(index,result){
$('.palettes').append('
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">${result.name}</h3>
</div>
<div class="panel-body">
<div class="col-md-12 colors">
<div class="color" style=background-color:#${result['color 1']}><h6>${result['color 1']}</h6></div>
<div class="color" style=background-color:#${result['color 2']}><h6>${result['color 2']}</h6></div>
<div class="color" style=background-color:#${result['color 3']}><h6>${result['color 3']}</h6></div>
<div class="color" style=background-color:#${result['color 4']}><h6>${result['color 4']}</h6></div>
${if(result['color 5']){
<div class="color" style=background-color:#${result['color 5']}><h6>${result['color 5']}</h6></div>
}
}
<div class="color" style=background-color:#${result['color 5']}><h6>${result['color 5']}</h6></div>
<p>on hover change to translucent background and black text for ecah color</p>
</div>
</div>
<div class="panel-footer">
<a class="btn btn-info btn-lg" href="update.html?id=${result.id}">Edit</a>
<a class="btn btn-danger btn-lg">Delete</a>
</div>
</div>'
)
})
})