Angular JS changing the variable syntax

Question

I need to change how Angular echos variables, after reading some tutorials I gather I need to:

change the interpolation symbols in Laravel. Simply pass the $interpolateProvider to your app module, and set the tags you wish to use instead.

As I'm new to Angular I have no idea what that means. So I have the following:

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script>

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

</script>

<div ng-app="">
  <p>Name: <input type="text" ng-model="name"></p>
  <h1>Hello [[name]]</h1>
</div>

What am I doing wrong?

JMK · Accepted Answer · 2016-01-18 19:37:28Z

3

You need to do this in your config function, the following should work:

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script>

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

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

</script>

<div ng-app="studious">
<p>Name: <input type="text" ng-model="name"></p>
<h1>Hello [[name]]</h1>

</div>

answered Jan 18, 2016 at 19:37

JMK

28.2k56 gold badges176 silver badges293 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Cyril Gandon · Accepted Answer · 2016-01-18 19:41:32Z

2

Look at the example in the docs $interpolateProvider, you need to configure in the .config method:

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

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


customInterpolationApp.controller('DemoController', function() {
  this.name = "Dale Snowdon";
});

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>


<div ng-app="customInterpolationApp" ng-controller="DemoController as demo">
  <p>Name:
    <input type="text" ng-model="demo.name">
  </p>
  <h1>Hello [[demo.name]]</h1>
</div>

edited Jan 18, 2016 at 19:41

answered Jan 18, 2016 at 19:35

Cyril Gandon

17.1k15 gold badges84 silver badges124 bronze badges

Collectives™ on Stack Overflow

Angular JS changing the variable syntax

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related