使用小胡子显示对象数组中的第一个对象

Question

我是 Mustache 的新手，正在尝试弄清楚如何使用 mustache 在列表中显示第一个对象数组。我希望能够传递一个 varialbe 来决定使用 mustache 模板显示列表的哪个索引。例如：

var template = $('#testing_tmp').html();
        var dataId = 1;
        var html =  Mustache.to_html(template, projects[dataId]);
        $('#header').html(html);

执行上面的代码会传递具有给定索引的数据并显示具有给定键的单个对象，而不是整个对象列表。

这是我目前的代码：

    <script id="testing_tmp" type="text/template">
        {{#proj}}
            <div>{{id}} go get some {{title}}</div>
        {{/proj}}
    </script>


$('body').on('click', '.logo', function(){
        var projects = { 
            "proj": [
                {
                    id:"1",
                    title:"Ronald",
                    description:"This web applications was developed to keep track of my dads recipes and make them easily accesible.He is now able to check each user and make a dinner based on what everybody likes or in some cases dont like.",
                    technologiesUsed:"CodeIgniter, PHP, Sequel Pro, Javascript, jQuery,HTML5, CSS3, SASS, Foundation 5.0", 
                    projectLink:"http://www.google.com",
                    genre:"web-app",
                    images: [
                        {largePic:"img/projects/heller-recipes/thumb.jpg",desktopImg:"img/projects/heller-recipes/desktop.png",desktopMobile:"img/projects/heller-recipes/mobile.png"}
                    ]
                },
                {
                    id:"2",
                    title:"Jake",
                    description:"This web applications was developed to keep track of my dads recipes and make them easily accesible.He is now able to check each user and make a dinner based on what everybody likes or in some cases dont like.",
                    technologiesUsed:"CodeIgniter, PHP, Sequel Pro, Javascript, jQuery,HTML5, CSS3, SASS, Foundation 5.0", 
                    projectLink:"http://www.google.com",
                    genre:"web-app",
                    images: [
                        {largePic:"img/projects/heller-recipes/thumb.jpg",desktopImg:"img/projects/heller-recipes/desktop.png",desktopMobile:"img/projects/heller-recipes/mobile.png"}
                    ]
                },
                {
                    id:"3",
                    title:"Benny",
                    description:"This web applications was developed to keep track of my dads recipes and make them easily accesible.He is now able to check each user and make a dinner based on what everybody likes or in some cases dont like.",
                    technologiesUsed:"CodeIgniter, PHP, Sequel Pro, Javascript, jQuery,HTML5, CSS3, SASS, Foundation 5.0", 
                    projectLink:"http://www.google.com",
                    genre:"web-app",
                    images: [
                        {largePic:"img/projects/heller-recipes/thumb.jpg",desktopImg:"img/projects/heller-recipes/desktop.png",desktopMobile:"img/projects/heller-recipes/mobile.png"}
                    ]
                }
            ]
        };
        var template = $('#testing_tmp').html();
        //alert(template);
        var html =  Mustache.to_html(template, projects[1]);
        $('#header').html(html);
        });

Answer 1

你可以这样做：

var html =  Mustache.to_html(template, { "proj" : projects.proj[1] });

在这里，您基本上只是将对象重组为看起来像 projects，但其中只有第二个对象。

使用小胡子显示对象数组中的第一个对象

Display first object in object array using mustache

jquery

templates

mustache