AngularJS-Twig与双花括号冲突

12 回答

• 17

  您可以使用 interpolateProvider service更改开始和结束插值标签 . 一个方便的地方是模块初始化时间 .

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

  http://docs.angularjs.org/api/ng.$interpolateProvider

  回复于 2024-04-25T15:57:12+08:00
• 23

  这个问题似乎得到了回答，但是一个没有被提及的更优雅的解决方案是简单地将花括号括在树枝花括号之间的引号中，如下所示：

  {{ '{{myModelName}}' }}
  

  如果您使用变量作为内容，请执行以下操作：

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

  你应该使用 single quotes ，而不是双引号 . 双引号启用Twig的字符串插值，因此您必须更加小心内容，尤其是在使用表达式时 .

  ---

  如果您仍然讨厌看到所有这些花括号，您还可以创建一个简单的宏来自动执行该过程：

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

  将其另存为文件并将其导入模板 . 我使用 ng 作为名称，因为它短而甜 .

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

  或者您可以将宏放在模板的顶部并将其导入为_self (see here)：

  {% import _self as ng %}
  

  然后使用如下：

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

  这输出：

  {{myModelName}}
  

  ---

  ......以及那些在Twig旁边使用MtHaml的人的跟进 . MtHaml允许以正常方式使用AngularJS curlies，因为可以访问任何Twig代码 - 而不是{{}} . 例如：

  纯HTML 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 }}
  

  回复于 2024-04-25T15:57:12+08:00
• 15

  正如在关于Django和AngularJS的类似问题中所提到的，更改默认符号（在Twig或AngularJS中）的技巧可能会与使用这些符号的第三方软件不兼容 . 所以我在谷歌找到的最佳建议：https://groups.google.com/d/msg/symfony2/kyebufz4M00/8VhF1KWsSAEJ

  TwigBundle不为词法分隔符提供配置，因为更改它们会禁止您使用共享包提供的任何模板（包括TwigBundle自身提供的异常模板） . 但是，您可以在角度模板周围使用原始标记，以避免逃避所有花括号的痛苦：http：//twig.sensiolabs.org/doc/tags/raw.html - Christophe | STOF

  标签已重命名为verbatim

  回复于 2024-04-25T15:57:12+08:00
• 17

  您也可以使用基于属性的指令 <p ng-bind="yourText"></p> 与 <p>{{yourText}}</p> 相同

  回复于 2024-04-25T15:57:12+08:00
• 0

  您可以使用 \{{product.name}} 来获取Handlebars忽略的表达式，而不是Angular使用的表达式 .

  回复于 2024-04-25T15:57:12+08:00
• 26

  如果您对更改现有角度语法的模板标签不感兴趣，则需要对现有角度模板进行一些令人困惑的重写 .

  可以使用带有角度标签的树枝模板标签，如下所示：

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

  在另一个类似的线程answer找到这个：Angularjs on a symfony2 application

  回复于 2024-04-25T15:57:12+08:00
• 2

  或者，您可以更改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);
  

  回复于 2024-04-25T15:57:12+08:00
• 88

  根据this post你应该能够这样做：

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

  回复于 2024-04-25T15:57:12+08:00
• -1

  这是最佳答案的编译版本和逐字块的示例：

  对于单次插入，请使用：

  {{ '{{model}}' }}
  

  或者如果你使用树枝变量

  {{ '{{' ~ twigVariableWitModelName ~ '}}' }}
  

  Verbatim，对于几个角度变量非常优雅和可读：

  <table ng-table>
      {% verbatim %}
          <tr ng-repeat="user in $data">
          <td data-title="'Name'">{{user.name}}</td>
          <td data-title="'Age'">{{user.age}}</td>
          </tr>
      {% endverbatim %}
  </table>
  

  回复于 2024-04-25T15:57:12+08:00
• 34

  我喜欢@pabloRN，但我更喜欢使用span而不是p，因为对我来说p会在结果中添加一行 .

  我会用这个：

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

  我也使用带有双引号内的光标的文本，所以我不必一遍又一遍地重写整个事情 .

  回复于 2024-04-25T15:57:12+08:00
• 282

  你可以用树枝创建一个函数来包围你的角度指令，所以不要去...

  {{"angular"}}

  你走 ...

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

  回复于 2024-04-25T15:57:12+08:00
• 16

  您可以在AngularJS表达式之前简单地加上“@”，例如：

  @{{ app.property }}
  

  通过这种方式，Twig将忽略此字符串，Angular最终可以使用双花括号表达式完成它们的工作 .

  回复于 2024-04-25T15:57:12+08:00