我使用小胡子作为模板引擎。我想使用handlebars.js,但handlebars.js根本不起作用。路径是正确的。
我认为handlebars.js和小胡子在我的项目中存在冲突......
目前它不适用于我们的项目。我不知道这是因为胡子模板引擎。 handlebars.js适用于使用jsfiddle或javascript创建的项目。使用相同的代码。enter code here
我想知道是否有办法避免冲突或其他方式。
这是我的环境:spring boot 1.5.9,小胡子模板引擎
$(document).on("keyup", "input[name='search_member']",function() {
$(".edge_search_list").show();
$(".search_list").show();
var email_pattern = $("input[name='search_member']").val();
$.ajax({
type: "GET",
url: "/searchMember/" + email_pattern,
dataType: "text",
beforeSend:function(){
setTimeout(function(){
$(".btn_search").css('background','url("../../resources/images/gif/ajax_loading.gif") no-repeat 5px center/contain');
},300);
},
success: function(data) {
var context = JSON.parse(data);
console.log(context);
if(context.length > 0) {
var target = $("#search-template").html();
var template = Handlebars.compile(target);
var html = "";
for(var i =0;i<context.length;i++){
html = html + template(context);
$(".search_list").html(html);
}
} else {
var html2 = $("#search-template2").html();
$(".search_list").html(html2);
}
},
complete:function(){
setTimeout(function(){
$(".btn_search").css('background','url("../../resources/images/icon/search_btn.png") no-repeat 5px center/contain');
},1500);
}
});
});
<script id="search-template" type="text/x-handlebars-template">
<div class="search_user_data">
<div>
<img src="{{#search_thumbnail}}{{search_thumbnail}}{{/search_thumbnail}}{{^search_thumbnail}}../../../resources/images/default-person.gif{{/search_thumbnail}}" alt="ㅁㅁㅁ님">
</div>
<div class="search_info left">
<div>{{#search_email}}{{search_email}}{{/search_email}}null@naver.com</div>
<div>{{#search_name}}{{search_name}}{{/search_name}}홍길동<span class="invitation_status">(초대됨)</span></div>
</div>
<div>
<button class="btn_search_invite">취소</button>
</div>
</div>
使用console.log()的JSON RESULT enter image description here