javascript - mustache js 无法从 json 文件加载 View 作为数组

Question

我正在尝试从我的 JSON 文件加载我的数据，但显然只加载了第一个属性。我通过使用 jQuery push 方法从我的 JSON 文件中提取数据创建了一个数组。当我看到 console.log 的数组输出时，它看起来不错。 我不明白哪里出了问题

我的html

 <h2>My message list </h2>
{{#msg}}
<img src= {{icon}} >
{{subject}}             
{{detail}}
{{date}}
{{/msg}}

我的脚本

<script type="text/javascript">
    function loadUser1(){
    var template = $('#template').html();
    Mustache.parse(template);   // optional, speeds up future uses
        $.getJSON( "messages.json", function( data ) {
             console.log('loaded');
             var messageslist = []; // create array here
             $.each(data.messages, function (index, message) {
             messageslist.push("{icon:'"+message.icon+"',subject:'"+message.subject+",detail:'"+message.detail+"',date:'"+message.date+"'}"); //push values here            
            });
             console.log(messageslist);//see output
             var rendered = Mustache.render(template,{"msg":messageslist});
             $('#target').html(rendered);
        });
    }
    </script>

数组显示在控制台中:(我在 json 中有重复的虚拟数据)

Array [ "{icon:'images/alert_bad.png',subject:'Supply Chain - Past Due,detail:'Gerry Harrison',date:'01/16/2015'}", "{icon:'images/alert_bad.png',subject:'Supply Chain - Past Due,detail:'Gerry Harrison',date:'01/16/2015'}", "{icon:'images/alert_bad.png',subject:'Supply Chain - Past Due,detail:'Gerry Harrison',date:'01/16/2015'}" ]

Answer 1

您正在将对象创建为 JSON 字符串而不是 javascript 对象，试试这个:

var rendered = Mustache.render(template,{"msg": data.messages});

data.messages 已经正确，不需要推送到另一个数组。