Question

我是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，但只包含第二个对象。

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

1 个答案: