Javascript 将JSON数组转换为Mustache
我试图从JSON数组中获取数据,以显示在我的小胡子模板中。我已经做了几个小时了,但我仍然不知道我错过了什么(或者可能错过太多?) 请注意,此特定任务要求我使用Javascript 将JSON数组转换为Mustache,javascript,json,ajax,mustache,Javascript,Json,Ajax,Mustache,我试图从JSON数组中获取数据,以显示在我的小胡子模板中。我已经做了几个小时了,但我仍然不知道我错过了什么(或者可能错过太多?) 请注意,此特定任务要求我使用let而不是var 这是我的密码: HTML: Javascript: console.log($); $(document).ready(function() { $.getJSON('../data/content.json', result); function result (data, status){
let
而不是var
这是我的密码:
HTML:
Javascript:
console.log($);
$(document).ready(function() {
$.getJSON('../data/content.json', result);
function result (data, status){
console.log(data);
let template = $("#mustacheTemplate").html();
let content = data.items;
let output = Mustache.render(template, content);
console.log(output);
$('#output').html(output);
});
});
传递渲染时,需要传递数据,而不是data.item 这里我对您的
$.getJSON('../data/content.json',result)进行了注释代码>
这可能对你有帮助
功能结果(数据、状态){
数据={“项目”:[
{“头衔”:“木兰”,
《描述》:“改编自中国花木兰传说,是迪士尼第36部动画片。”
},
{“标题”:“美女与野兽”,
《描述》:“改编自童话故事,讲述一位面目狰狞的王子和一位坠入爱河的年轻女子。”
},
{“头衔”:“阿拉丁”,
“描述”:“阿拉丁是一个街头顽童,很久以前和他忠实的猴子朋友阿布一起住在阿格拉巴,一个大而繁忙的城镇。”
]
};
//控制台日志(数据);
let template=$(“#mustacheTemplate”).html();
//console.log(模板)
让内容=数据;
让输出=Mustache.render(模板、内容);
//控制台日志(输出);
$('#output').html(输出);
}
$(文档).ready(函数(){
//$.getJSON('../data/content.json',result);
结果(1,5);
});代码>
{{{#项目}
- {{title}}{{description}}
{{/items}
这里有什么问题吗?当我运行所有操作时,列表本身并没有出现。我想您在jsonKalaiselvan A中错过了“}”,是的!非常感谢。但是什么也没有出现(有什么错误吗?在你的控制台中!我查看了你的代码,在我的代码中添加了let content=data
,甚至用output
id尝试了单独的
,但是它没有打印任何东西我认为你在代码中遗漏了一些东西它在上面的代码片段中工作得很好是的,但我的json必须在不同的文件,但不在同一个函数中:/YourJSON数据是问题所在,首先您应该修复该问题,我在上面的注释中提到了它。}
在您的json数据中丢失了我在看到您的注释后添加了}
{ "items": [
{"title": "Mulan",
"description": "Based on the Chinese legend of Hua Mulan, and was Disney's 36th animated feature."
},
{"title": "Beauty and the Beast",
"description": "An adaptation of the fairy tale about a monstrous-looking prince and a young woman who fall in love."
},
{"title": "Aladdin",
"description": "Aladdin is a street-urchin who lives in Agrabah, a large and busy town, long ago with his faithful monkey friend Abu."
]},
}
console.log($);
$(document).ready(function() {
$.getJSON('../data/content.json', result);
function result (data, status){
console.log(data);
let template = $("#mustacheTemplate").html();
let content = data.items;
let output = Mustache.render(template, content);
console.log(output);
$('#output').html(output);
});
});