Форум

LimeSoft · #1 (**permalink**) 19.06.2016, 13:14

https://github.com/twigjs/twig.js/wiki - вот тут пишут аналог шаблонизатора twig (php).

Пример на той-же странице не рабочий, более того я не могу найти собранный файл twig.js, его предлагают скомпилить но непонятно в какой среде да и зачем мне с этим париться? (файл взял в одной из папок с примерами)

Удобно было бы использовать один шаблонизатор на сервере и в кшиенте.

Конкретно проблема: если template грузится ajax-om с сервера - всё работает как нужно, если прописывается (как в примере) прямо в js - выводит только статический текст (без элементов, итерации и разметки).

Прощу помощи в этом вопросе.

Так-же можете предложить другой шаблонизатор на js (а если есть его версия для бэкэнда на php - то вообще шикарно). Самое главное для меня это хороший функционал - с логикой вывода как в ЯП, и модульность - чтоб можно было повторно использовать куски шаблонов.
Первый опыт охота получить с нормальной библиотекой

destus · #2 (**permalink**) 19.06.2016, 14:15

LimeSoft,

Цитата:

его предлагают скомпилить но непонятно в какой среде да и зачем мне с этим париться? (файл взял в одной из папок с примерами)

В среде Node.js с использованием фреймворка Express.

Цитата:

если прописывается (как в примере) прямо в js - выводит только статический текст (без элементов, итерации и разметки).

А ты js файл с twig.js в html страничке подключил? Вроде всё работает.

npm install twig

<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script src="./node_modules/twig/twig.js"></script>
<script>
var twig = Twig.twig; 
var template = twig({
    id: "list", // id is optional, but useful for referencing the template later
    data: "{% for value in list %}{{ value }}, {% endfor %}"
});

var output = template.render({
    list: ["one", "two", "three"]
});

console.log(output); // output = "one, two, three, "

</script>
	
</body>
</html>

LimeSoft · #3 (**permalink**) 20.06.2016, 02:57

Сообщение от destus

А ты js файл с twig.js в html страничке подключил?

Естественно, и в консоли chrome ошибок не было. Более того, если он подгружает шаблон с сервера, с указанием имени файла - всё работает на ура(!). Если же inline - то выводит статичный текст игнорируя все содержимое блоков с логикой. по типу "Привет, {{name}}" - только "Привет, ". Повторюсь - текст шаблона в файле на сервере и при inline инициализации шаблона идентичен.

<script type="text/javascript">

    function testme() {

        var twig = Twig.twig;
        var template = twig({
            id: "list", // id is optional, but useful for referencing the template later
            //data: "static_text1 {% for value in list %}<b>{{ value }}</b>, {% endfor %} static_text2",
            href: "views/js/test.twig",
            async: false
        });
        var output = template.render({
            list: ["one", "two", "three"]
         });


        console.log(output); //static_text1 <b>one</b>, <b>two</b>, <b>three</b>,  static_text2
        $("#testid").html(output);
    }

</script>

Наверное я подключаю "не тот файл" twig.js. Нет у меня node.js сервера и компилить не могу, да и не хочу этот квест проходить. Нормальный/минифицированный файл они спрятали где-то в глубинах git репозитория

либо посчитали что тем кто будет использовать эту библиотеку такая хрень не нужна. а правда, зачем?

Alexof · #4 (**permalink**) 26.03.2017, 17:37

Вижу тема не новая, но решение так никто и не написал, а такая же проблема возникла и у меня - гугл по моему запросу выдал только эту тему (из адекватных).
Ссылка на готовый twig.js файл есть по этой ссылке https://github.com/philsbury/twigjs-bower в папке twig.
А решение проблемы оказалось простым - просто вынес весь код примера в отдельный js файл, подключил - и все заработало!

Спасибо за внимание

Форум

Справочник

Discord чат

Курсы javascript