Çift Kıvrımlı Parantez ile Açısal JS-Dal çatışması

Bildiğiniz gibi, hem açısal hem de dal ortak kontrol yapısına sahiptir - çift kıvırcık parantez. Açısal'ın varsayılan değerini nasıl değiştirebilirim?

Twig'de yapabileceğimi biliyorum, ama bazı projelerde yapamam, sadece JS.

interpolateProviderServisi kullanarak başlangıç ​​ve bitiş enterpolasyon etiketlerini değiştirebilirsiniz . Bunun için uygun bir yer modülün başlangıç ​​zamanıdır.

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

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

Bu soru cevaplanmış gibi görünüyor, ancak bahsedilmeyen daha zarif bir çözüm, kıvırcık parantezleri dal kıvırcık parantezler arasındaki tırnak işaretleri içine almaktır:

{{ '{{myModelName}}' }}

İçindekiler için bir değişken kullanıyorsanız, bunun yerine şunu yapın:

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

Çift tırnak değil, tek tırnak kullanmalısınız . Çift tırnak, Twig tarafından dize enterpolasyonunu etkinleştirir, bu nedenle, özellikle ifadeler kullanıyorsanız, içeriklere daha dikkatli olmanız gerekir.

Tüm bu süslü parantezleri görmekten hala nefret ediyorsanız, işlemi otomatikleştirmek için basit bir makro da oluşturabilirsiniz:

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

Dosya olarak kaydedin ve şablonunuza aktarın. ngAdı kısa ve tatlı olduğu için kullanıyorum .

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

Veya makroyu şablonunuzun en üstüne koyabilir ve _self olarak içe aktarabilirsiniz (buraya bakın) :

{% import _self as ng %}

Sonra aşağıdaki gibi kullanın:

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

Bu çıktılar:

{{myModelName}}

... ve TwHam ile birlikte MtHaml kullananların takibi . MtHaml, herhangi bir Twig koduna {{}} yerine - ve = olsa erişildiği için AngularJS curlies'in normal şekilde kullanılmasını sağlar. Örneğin:

Düz HTML + Açısal JS:

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

MtHaml + Açısal JS:

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

MtHaml stili Dallı MtHaml + AngularJS:

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

Django ve AngularJS hakkında benzer soruda belirtildiği gibi, varsayılan simgeleri (Twig veya AngularJS'de) değiştirme hilesi, bu sembolleri kullanacak olan üçüncü taraf yazılımlarla uyumsuzluk sağlayabilir. Google'da bulduğum en iyi tavsiye: https://groups.google.com/d/msg/symfony2/kyebufz4M00/8VhF1KWsSAEJ

TwigBundle, lexer sınırlayıcıları için bir yapılandırma sağlamaz; çünkü bunları değiştirmek, paylaşılan paketler tarafından sağlanan herhangi bir şablonu (TwigBundle tarafından sağlanan istisna şablonları dahil) kullanmanızı yasaklar.

Ancak, tüm kıvırcık parantezlerden kaçmanın acısını önlemek için açısal şablonlarınızın etrafındaki ham etiketi kullanabilirsiniz: http://twig.sensiolabs.org/doc/tags/raw.html - Christophe | stof

Etiket kelimesi kelimesine yeniden adlandırıldı

Öznitelik tabanlı yönerge <p ng-bind="yourText"></p>ile aynı olan<p>{{yourText}}</p>

\{{product.name}}Gidon tarafından göz ardı edilen ve bunun yerine Angular tarafından kullanılan ifadeyi almak için kullanabilirsiniz .

Bu, en iyi yanıtların derlenmiş bir sürümüdür ve kelimesi kelimesine bloklar için bir örnektir:

Tek eklemeler için şunları kullanın:

{{ '{{model}}' }}

veya bir dal değişkeni kullanıyorsanız

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

Verbatim , birkaç açısal değişken için çok zarif ve okunabilir:

<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>

Mevcut açısal sözdiziminin şablon etiketlerini değiştirmek istemiyorsanız, mevcut açısal şablonlarınızın kafa karıştırıcı bir şekilde yeniden yazılmasını gerektirecektir.

Dal şablon etiketlerini aşağıdaki gibi açısal etiketlerle kullanabilirsiniz:

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

Bunu başka bir benzer konu cevabında buldu : Bir symfony2 uygulamasındaki Angularjs

Alternatif olarak Twig tarafından kullanılan karakterleri değiştirebilirsiniz. Bu Twig_Lexer tarafından kontrol edilir .

$twig = new Twig_Environment();

$lexer = new Twig_Lexer($twig, array(
    'tag_comment'   => array('[#', '#]'),
    'tag_block'     => array('[%', '%]'),
    'tag_variable'  => array('[[', ']]'),
    'interpolation' => array('#[', ']'),
));
$twig->setLexer($lexer);

Bu gönderiye göre bunu şu şekilde yapabilmelisiniz:

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

@PabloRN seviyorum, ama p yerine span kullanmayı tercih ederim, çünkü benim için p sonuca satır ekleyecektir.

Bunu kullanacağım:

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

Ayrıca çift tırnak içinde imleç ile aText kullanın, böylece her şeyi tekrar tekrar yazmak zorunda kalmazsınız.

Açısal direktiflerinizi çevrelemek için dalda bir işlev oluşturabilirsiniz, böylece gitmek yerine ...

{{"angular"}}

git ...

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