197

ご存じのように、angular と twig の両方に共通のコントロール構造 (二重中括弧) があります。Angular のデフォルト値を変更するにはどうすればよいですか?

Twigでできることは知っていますが、一部のプロジェクトではできず、JSのみです。

4

11 に答える 11

288

サービスを使用して開始および終了補間タグを変更できますinterpolateProvider。これに便利な場所の 1 つは、モジュールの初期化時です。

angular.module('myApp', []).config(function($interpolateProvider){
    $interpolateProvider.startSymbol('{[{').endSymbol('}]}');
});

https://docs.angularjs.org/api/ng/provider/$interpolateProvider

于 2012-12-02T17:34:13.537 に答える
91

この質問には答えがあるように見えますが、言及されていないより洗練された解決策は、次のように小枝の中括弧の間で中括弧を引用符で囲むことです。

{{ '{{myModelName}}' }}

コンテンツに変数を使用している場合は、代わりに次のようにします。

{{ '{{' ~ yourvariable ~ '}}' }}

二重引用符ではなく、単一引用符を使用する必要があります。二重引用符は、Twig による文字列補間を有効にするため、特に式を使用している場合は、内容に注意する必要があります。

それでも中括弧がすべて表示されるのが嫌な場合は、単純なマクロを作成してプロセスを自動化することもできます。

{% macro curly(contents) %}
   {{ '{{' ~ contents ~ '}}' }}
{% endmacro %}

ファイルとして保存し、テンプレートにインポートします。ng短くて甘いので名前に使っています。

{% import "forms.html" as ng %}

または、マクロをテンプレートの先頭に置き、_self としてインポートすることもできます(こちらを参照)。

{% import _self as ng %}

次に、次のように使用します。

{{ ng.curly('myModelName') }}

これは以下を出力します:

{{myModelName}}

...そして、Twig と一緒にMtHamlを使用している方へのフォローアップです。MtHaml では、通常の方法で AngularJS カーリーを使用できます。これは、Twig コードが {{ }} の代わりに - and = を介してアクセスされるためです。例えば：

プレーン HTML + AngularJS:

<tr ng-repeat="product in products">
   <td> {{ product.name }} </td>
</tr>

MtHaml + AngularJS:

%tr(ng-repeat="product in products")
   %td {{ product.name }}

MtHaml + AngularJS と MtHaml スタイルの小枝:

- set twigVariable = "somevalue"
= twigVariable
%tr(ng-repeat="product in products")
   %td {{ product.name }}
于 2014-01-19T01:40:05.337 に答える
37

Django と AngularJS に関する同様の質問で述べたように、(Twig または AngularJS で) デフォルトのシンボルを変更するトリックは、これらのシンボルを使用するサードパーティ ソフトウェアとの非互換性を提供する可能性があります。グーグルで見つけた最善のアドバイス：https://groups.google.com/d/msg/symfony2/kyebufz4M00/8VhF1KWsSAEJ

TwigBundle はレクサー区切り文字の構成を提供しません。これを変更すると、共有バンドルによって提供されるテンプレート (TwigBundle 自体によって提供される例外テンプレートを含む) を使用できなくなるためです。

ただし、角度のあるテンプレートの周りに生のタグを使用して、すべての中括弧をエスケープする手間を省くことができます : http://twig.sensiolabs.org/doc/tags/raw.html ストフ

タグの名前がverbatimに変更されました

于 2013-02-06T00:43:14.903 に答える
24

\{{product.name}}Handlebars によって無視され、代わりに Angular によって使用される式を取得するために使用できます。

于 2014-03-18T20:37:51.353 に答える
19

既存のAngularテンプレートの複雑な書き直しが必要になる既存のAngular構文のテンプレートタグを変更することに興味がない場合。

次のように、小枝テンプレートタグを角度付きタグで使用できます。

{% verbatim %}{{yourName}}{% endverbatim %}

別の同様のスレッドの回答でこれを見つけました: Angularjs on a symfony2 application

于 2013-11-15T20:11:58.187 に答える
18

または、Twig が使用する文字を変更することもできます。これはTwig_Lexerによって制御されます。

$twig = new Twig_Environment();

$lexer = new Twig_Lexer($twig, array(
    'tag_comment'   => array('[#', '#]'),
    'tag_block'     => array('[%', '%]'),
    'tag_variable'  => array('[[', ']]'),
    'interpolation' => array('#[', ']'),
));
$twig->setLexer($lexer);
于 2014-04-16T13:08:16.540 に答える
17

この投稿によると、次のようにできるはずです：

angular.module('app', [])
  .config(['$interpolateProvider', function ($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
  }]);
于 2012-12-02T17:30:49.183 に答える
2

私は @pabloRN が好きですが、p の代わりにスパンを使用したいと思います。なぜなら、p は結果に行を追加するからです。

私はこれを使用します：

<span ng-bind="yourName"></span>

また、二重引用符内のカーソルで aText を使用しているため、すべてを何度も書き直す必要はありません。

于 2014-11-28T13:14:30.567 に答える
1

twig で関数を作成して、Angular ディレクティブを囲むことができます。

{{"angular"}}

あなたが行く ...

{{angular_parser("angular stuff here output curlies around it")}}

于 2015-04-02T18:58:52.073 に答える