Как изменить разделитель по умолчанию для Handlebars.js?

Мне нужно использовать handlebars.js, а также я использую шаблонный движок Blade от Laravel (PHP Framework). Теги {{}} конфликтуют с заполнителями блейдов, которые в точности совпадают.

Как я могу изменить эти {{var}} на что-то вроде <% var%>?

Источник

8 ответов

Решение

Это невозможно со "стандартными" рулями. https://github.com/wycats/handlebars.js/issues/227

Источник

Хотя это может быть правдой, что вы не можете настроить разделители выражений Handlebars, но это не единственный способ разрешить конфликт между Handlebars и Blade. Blade предоставляет синтаксис, который позволяет вам избежать конфликта, определяя, что должно быть передано на руль. (Это подходит, поскольку Blade изначально создал конфликт, и это необходимо, поскольку Blade обрабатывает шаблон еще до того, как Handlebars его увидит.) Просто подготовьте @ перед фигурными скобками, которые вы хотите, чтобы Blade игнорировал и передавал как есть на Handlebars. Вот очень короткий фрагмент гораздо большего примера:

...
    <link
        rel="stylesheet"
        type="text/css"
        href="{{ asset("css/bootstrap.theme.3.0.0.css") }}"
    />
    <title>Laravel 4 Chat</title>
</head>
<body>
    <script type="text/x-handlebars">
        @{{outlet}}
    </script>
...

{{outlet}} будут переданы на руль, но {{ asset("css/bootstrap.theme.3.0.0.css") }} будет обрабатываться Blade.

Источник

Я создал разделители handlebars на GitHub / npm, чтобы упростить использование пользовательских разделителей с Handlebars.

var Handlebars = require('handlebars');
var useDelims = require('handlebars-delimiters');

var a = Handlebars.compile('{{ name }}<%= name %>')({name: 'Jon'});
console.log(a);
//=> 'Jon<%= name %>'


// Pass your instance of Handlebars and define custom delimiters
useDelims(Handlebars, ['<%=', '%>']);
var b = Handlebars.compile('{{ name }}<%= name %>')({name: 'Jon'});
console.log(b);
//=> '{{ name }}Jon'

Идея для функции компиляции пришла с /questions/42298002/kak-izmenit-razdelitel-po-umolchaniyu-dlya-handlebarsjs/42298029#42298029

Предложения по улучшению или тянуть запросы приветствуются!

Источник

Вместо изменения разделителей вы можете создавать файлы с вашими шаблонами руля без .blade расширение. Просто включите эти файлы в свой шаблон лезвия. Например

Файл шаблона лезвия - template.blade.php

@extends('master.template')

@section('content')

    @include('handlebars-templates/some-template-name') 

@stop

Файл some-template-name - файл some-template-name.php

<script type="text/x-handlebars" data-template-name="content">
<div>
 <label>Name:</label>
 {{input type="text" value=name placeholder="Enter your name"}}
</div>
<div class="text">
<h1>My name is {{name}} and I want to learn Ember!</h1>
</div>
</script>
Источник

Я сделал эту функцию. Надеюсь, что это может быть полезно для кого-то..

/**
* change the delimiter tags of Handlebars
* @author Francesco Delacqua
* @param string start a single character for the starting delimiter tag
* @param string end a single character for the ending delimiter tag
*/
Handlebars.setDelimiter = function(start,end){
    //save a reference to the original compile function
    if(!Handlebars.original_compile) Handlebars.original_compile = Handlebars.compile;

    Handlebars.compile = function(source){
        var s = "\\"+start,
            e = "\\"+end,
            RE = new RegExp('('+s+'{2,3})(.*?)('+e+'{2,3})','ig');

            replacedSource = source.replace(RE,function(match, startTags, text, endTags, offset, string){
                var startRE = new RegExp(s,'ig'), endRE = new RegExp(e,'ig');

                startTags = startTags.replace(startRE,'\{');
                endTags = endTags.replace(endRE,'\}');

                return startTags+text+endTags;
            });

        return Handlebars.original_compile(replacedSource);
    };
};

//EXAMPLE to change the delimiters to [:
Handlebars.setDelimiter('[',']');
Источник

"Если вам нужно отобразить строку, заключенную в фигурные скобки, вы можете избежать поведения Blade, добавив к тексту префикс @"

@{{varname}}

Надеюсь, поможет!

Источник

Я использовал и обновил исходный код user1875109, и теперь он работает с Handlebars v3.0.3:

/**
* change the delimiter tags of Handlebars
* @author Francesco Delacqua
* @param string start a single character for the starting delimiter tag
* @param string end a single character for the ending delimiter tag
*/
Handlebars.setDelimiter = function(start,end){
    //save a reference to the original compile function
    if(!Handlebars.original_compile) Handlebars.original_compile = Handlebars.compile;

    Handlebars.compile = function(source){
        var s = "\\"+start,
            e = "\\"+end,
            RE = new RegExp('('+s+')(.*?)('+e+')','ig');

            replacedSource = source.replace(RE,function(match, startTags, text, endTags, offset, string){
                var startRE = new RegExp(s,'ig'), endRE = new RegExp(e,'ig');

                startTags = startTags.replace(startRE,'\{');
                endTags = endTags.replace(endRE,'\}');

                return startTags+text+endTags;
            });

        return Handlebars.original_compile(replacedSource);
    };
};

//EXAMPLE to change the delimiters to [:
Handlebars.setDelimiter('[',']');
Источник

Существует возможность указать механизму шаблонов, что он не анализирует определенную часть кода, и рассматривать его как обычный текст.

Найдите следующие способы сделать это, надеюсь, это кому-нибудь поможет.

В движке шаблонов лезвий (laravel) вы можете использовать директиву @verbatim. Так что вам не нужно добавлять @ к каждой переменной. Пример:

@verbatim
    <div class="container">
        Hello, {{ name }}.
    </div>
@endverbatim

Точно так же для механизма шаблонов веток (Symfony) вы можете заблокировать весь код, используя

{% verbatim %}
    <div>
        My name is {{name}}. I am a {{occupation}}.
    </div>
{% endverbatim %}
Источник
Другие вопросы по тегам