What is the difference between the $parse, $interpolate and $compile services?

Question

What is the difference between $parse, $interpolate and $compile services? For me they all do the same thing: take template and compil

Answer 1

$interpolate-->

Let us say you have two variables assigned to $scope object in the controller,

$scope.a = 2;
$scope.b = 3;

var f = $interpolate("Result is : {{a*b}}");
var result = f($scope);
console.log(result);   --->'Result is 6'

This means that $interpolate can take the string which has one or more angular expressions.

Now $parse:

var f1 = $parse("a*b");
var result1 = f1($scope);
console.log(result1);   ----> '6'

**So $interpolate has the capability to evaluate a string with angular expressions mixed up in the string against the scope to get the result**.


Another important difference between $interpolate and $parse,$eval is:

**$interpolate has the capability to work with strings containing filters along with angular expressions.**

This feature is not accessible in $eval , $parse.

console.log($interpolate("Result is : {{a*b | currency : 'USD$'}}")($scope));

---> 'Result is USD $6.00'

$interpolate does not have the write access to the $scope variables as we have in $eval and $parse

$parse , $interpolate --->needs to be injected but $eval need not be injected in the controller or where it is used

$parse , $interpolate give the function which can be evaluated against any context but $eval is always evaluated against $scope.

$eval and $interpolate behind the scenes uses $parse only.