Twig and AngularJS curly braces conflict solution

Whoever loves to work with Twig template system for their PHP driven web application may want to implement AngularJS within Twig template. But the main problem will be Twig’s curly braces. AngularJS and Twig both use __ inside their template to output data. So simply, it can cause trouble to work with this two lovely systems together in your application.

But here is the solution. According to AngularJS $interpolateProvider docs I figured out the easy solution. You can change AngularJS __ symbol with any other symbol. Cool! So see how you will override that configuration.

var app = angular.module('myApp', []);

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

Now you can use {[{ }]} symbol for your AngularJS. And Twig use **. So problem solved. From now on you can use AngularJS within your Twig template system.