17

handlebars.jsを使用する必要があり、Laravel（PHP Framework）のBladeテンプレートエンジンも使用しています。タグ{{}}は、まったく同じブレードのプレースホルダーと競合します。

これらの{{var}}を<％var％>のようなものに変更するにはどうすればよいですか？

4

8 に答える 8

29

ハンドルバーの式の区切り文字を構成できないことは事実かもしれませんが、ハンドルバーとブレードの間の競合を解決する方法はそれだけではありません。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") }}ますが、ブレードによって処理されます。

于 2013-12-26T17:12:08.810 に答える
8

ハンドルバーでカスタムデリムを簡単に使用できるように、GitHub/npmでハンドルバー区切り文字を作成しました。

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'

コンパイル機能のアイデアはhttps://stackoverflow.com/a/19181804/1267639から来ました

改善の提案やプルリクエストは大歓迎です！

于 2014-09-14T13:41:13.553 に答える
5

この関数を作成しました。それが誰かに役立つことを願っています。

/**
* 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('[',']');
于 2013-10-04T12:58:33.963 に答える
5

.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>
于 2013-10-31T12:26:24.990 に答える
4

これは「標準」ハンドルバーでは不可能です。https://github.com/wycats/handlebars.js/issues/227

于 2013-01-14T19:06:45.150 に答える
3

「中括弧で囲まれた文字列を表示する必要がある場合は、テキストの前に@記号を付けることで、Bladeの動作を回避できます。」

@{{varname}}

それが役に立てば幸い！

于 2014-10-07T11:24:39.910 に答える
0

user1875109のソースコードを使用して更新しましたが、Handlebarsv3.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('[',']');
于 2015-07-19T15:49:16.013 に答える
-1

コードの特定の部分を解析せず、プレーンテキストとして扱うようにテンプレートエンジンに指示するオプションがあります。

それを行うための次の方法を見つけてください、それが誰かを助けることを願っています。

ブレードテンプレートエンジン（laravel）では、@verbatimディレクティブを使用できます。そのため、すべての変数に@を追加する必要はありません。例 ：

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

同様に、twigテンプレートエンジン（symfony）の場合、次を使用してコード全体をブロックできます。

{% verbatim %}
    <div>
        My name is {{name}}. I am a {{occupation}}.
    </div>
{% endverbatim %}
于 2018-06-30T08:14:16.747 に答える