The expression {{}} binds data to HTML same like ng-bind directive. But ng-bind is better approach than {{}}. Followings are few of the considerations.
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="" data-ng-init="var1=5;var2=7">
<p>Result = <span data-ng-bind="var1+var2"></span></p>
<div>Result = {{(var1+var2)}}</div>
</div>
</body>
</html>
- Key difference is {{ }} can flash on page load while ‘ng-bind’ hides the expression until it is displayed correctly.
- The Angular JS registers a watcher for the variable being used in ng-bind.
- The ‘ng-bind’ stores only value of the variable in memory.
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="" data-ng-init="var1=5;var2=7">
<p>Result = <span data-ng-bind="var1+var2"></span></p>
<div>Result = {{(var1+var2)}}</div>
</div>
</body>
</html>
