mustache js无法从json文件加载视图作为数组

时间:2015-05-20 15:13:08

标签: javascript jquery json mustache

我正在尝试从我的JSON文件加载数据,但显然只加载了第一个属性。我通过使用jQuery push方法从我的JSON文件中提取数据来创建一个数组。当我从console.log看到数组输出时,它看起来很好。 only the first attribute was loaded 我不知道出了什么问题

我的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'}" ]

1 个答案:

答案 0 :(得分:2)

您将对象创建为JSON字符串而不是javascript对象,请尝试以下操作:

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

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