AngularJS, how to change bracket tags ({{e}}) to any other character of your choice?

5

In AngularJS by default comes the bracket tags ( {{ and }} ) for manipulation, wanted change to %% and %% , how should I proceed?

Example:

{{name}}

to

%%name%%
    
asked by anonymous 01.06.2014 / 02:27

1 answer

7

To change, you need to set up your application in this way: in the $ interpolateProvider , place the startSymbol and endSymbol set to %%

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

App.config(function($interpolateProvider) {
      $interpolateProvider.startSymbol('%%');
      $interpolateProvider.endSymbol('%%');
});

Example:

Angular:

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

App.config(function($interpolateProvider) {
      $interpolateProvider.startSymbol('%%');
      $interpolateProvider.endSymbol('%%');
});

function PeopleListCtrl($scope){
    $scope.peoples = [
        {'id': 1, 'name': 'Nome 1'}, 
        {'id': 2, 'name': 'Nome 2'}
    ];     
};

Full HTML with AngularJS:

<!DOCTYPE HTML>
<html ng-app="App">
<head>
<meta charset="utf-8">
<title></title>
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.10/angular.min.js"></script></head><body><div><divng-controller="PeopleListCtrl">
        <br />
        <p>Quantidade: %%peoples.length%%</p>
        <br />
        <ol>
            <li ng-repeat="p in peoples">%%p.id%% - %%p.name%%</li>
        </ol>
    </div>
  </div>
  <script>
    var App = angular.module('App',[]);
    App.config(function($interpolateProvider) {
          $interpolateProvider.startSymbol('%%');
          $interpolateProvider.endSymbol('%%');
    });

    function PeopleListCtrl($scope){
        $scope.peoples = [
            {'id': 1, 'name': 'Nome 1'}, 
            {'id': 2, 'name': 'Nome 2'}
        ];     
    };
  </script>
</body>
</html>

Result: jsfiddle

References:

01.06.2014 / 02:28