up paths

sources/cipherbliss_blog/lang_fr/20151208T091242__twig-et-angular.org

@@ -0,0 +1,64 @@
+
+:PROPERTIES:
+:ID: b5a66830-d196-4a2f-92b8-19a5c0ed080b
+:END:
+
+#+title: twig-et-angular
+#+post_ID: 197
+#+post_slug: twig-et-angular
+#+post_url: https://www.ciperbliss.com/2015/twig-et-angular
+#+post_title: twig et angular
+#+post_tags: null
+#+post_type: post
+#+post_mime_types: 
+#+post_guid: undefined
+#+post_status: publish
+#+post_date_published: <2015-12-08T09:12:42>
+#+post_date_modified: <2016-05-11T07:17:10>
+#+post_index_page_roam_id: fa7f2a8c-2b94-4e42-bb4c-25c026ed7ff9
+#+retrieved_from_db_at: <2024-11-18 16:25:08>
+
+
+* twig et angular
+:PROPERTIES:
+:CUSTOM_ID: twig-et-angular
+:END:
+
+twig utilise des marquerus en double accolade, angular aussi dans ses
+templates.SI on veut éviter de se marcher sur les
+pieds et de voir ses instructions de template angular mangées par celles
+de twig (car évaluées avant que le js n'y ait accès), il existe deux
+méthodes courantes:entourer les instructions angular
+de balise twig "verbatim" afin qu'elles ne soient pas interprêtées, ce
+qui rallonge considérablement le code des templates en plus d'être assez
+laid. 
+
+
+#+begin_example
+{% verbatim %}    {{ monExpressionAngular }}{% verbatim %}
+#+end_example
+
+
+ou bien on peut changer les marqueurs d'expressions angular dans la
+config de notre app. Par example, utiliser des double parenthèses. mon
+clavier azerty préfère, car cela évite de faire deux boutons pour un
+caractère. Pour cela, dans l'instanciation de votre app angular, dans la
+config, mettez le service $interpolateProvider et définissez lui ses
+symboles de début et de fin comme ceci:
+
+
+#+begin_src js
+(function () {    window.tykaynApp = angular.module('tykaynApp', [])        .config(['$interpolateProvider', function ($interpolateProvider) {            $interpolateProvider.startSymbol('((');            $interpolateProvider.endSymbol('))');        }])    ;})();
+#+end_src
+
+
+Ainsi vous aurez la possibilité de faire vos expressions angular dans
+twig avec des double parenthèses. (Sans oublier de définir ng-app et
+ng-controller dans votre template)
+
+
+#+begin_example
+    (( monExpressionAngular ))
+#+end_example
+
+