Предложить какой-нибудь добрый усатый документ - PullRequest
Новая
       4

Предложить какой-нибудь добрый усатый документ

0 голосов
/ 03 января 2012

Предложите мне любые хорошие усы док. Также я хочу узнать в цикле муштака, как мне получить count or the loop no. Я имею в виду, как я могу сделать for loop в усы.

В приведенном ниже коде я хочу изменить идентификатор в каждом цикле 

<script src="http://github.com/janl/mustache.js/raw/master/mustache.js"></script>  
<script>

var data, template, html;

data = {
    name : "Some Tuts+ Sites",
    big: ["Nettuts+", "Psdtuts+", "Mobiletuts+"],
    url : function () {
        return function (text, render) {
            text = render(text);
            var url = text.trim().toLowerCase().split('tuts+')[0] + '.tutsplus.com';
            return '<a href="' + url + '">' + text + '</a>';
        }
    }
};

 template = '<h1> {{name}} </h1><ul> {{#big}}<li id="no"> {{#url}} {{.}} {{/url}} </li> {{/big}}  </ul>';

html = Mustache.to_html(template, data);

document.write(html)

</script>
<body></body>

Ответы [ 2 ]

0 голосов
/ 08 февраля 2012

Расширяя ответ @ mu, вы также можете сохранить индекс в объекте данных и сделать так, чтобы шаблон ссылался на него, а функция увеличивала его. Так что вам не нужно добавлять i к каждому элементу. см. демонстрацию: http://jsfiddle.net/5vsZ2/

0 голосов
/ 03 января 2012

Вы не можете получить индекс массива в Усике, Усы преднамеренно просты и хотят, чтобы вы делали всю работу при настройке данных.

Однако вы можете настроить свои данные, чтобы включить индексы: 

data = {
    //...
    big: [
        { i: 0, v: "Nettuts+" },
        { i: 1, v: "Psdtuts+" },
        { i: 2, v: "Mobiletuts+" }
    ],
    //...
};

, а затем настройте шаблон так, чтобы использовать {{i}} в атрибутах id и {{v}} вместо {{.}} для текста: 

template = '<h1> {{name}} </h1><ul> {{#big}}<li id="no-{{i}}"> {{#url}} {{v}} {{/url}} </li> {{/big}}  </ul>';

И, кроме того, вы, вероятно, хотите включить схему в ваш url: 

url : function () {
    return function (text, render) {
        text = render(text);
        var url = text.trim().toLowerCase().split('tuts+')[0] + '.tutsplus.com';
        return '<a href="http://' + url + '">' + text + '</a>';
        //---------------^^^^^^^
    }
}

Демо: http://jsfiddle.net/ambiguous/SFXGG/

...