AngularJS Expressions

Expressions in Angular JS is written inside double braces: {{ expression }}. AngularJS expressions can also be written inside a directive: ng-bind="expression". AngularJS will resolve the expression, and return the exact output where the expression is written. This expressions are much like JavaScript expressions: They can contain literals, operators, and variables.
Example {{ 10 + 10 }} or {{ fName + " " + lName }}
Example :

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app>
<p>Required expression is: {{ 10 + 10 }}</p>
</div>
</body>
</html>

Output


Required expression is: 20

If you remove the ng-app directive, HTML will display the following expression:
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div>
<p>Required expression is: {{ 10 + 10 }}</p>
</div>
</body>
</html>

Output

Required expression is: {{ 10 + 10 }}

AngularJS Strings

AngularJS strings are like JavaScript strings:
Example :

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="" ng-init="fName='Trilochan';lName='Tarai'">
<p>My name is: {{ fName + " " + lName }}</p>
</div>
</body>
</html>
Output

My name is: Trilochan Tarai

AngularJS Objects

AngularJS objects are like JavaScript objects:
Example:

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="" ng-init="person={fName:'Trilochan',lName:'Tarai'}">
<p>My first name is {{ person.fName }}</p>
</div>
</body>
</html>
Output

My first name is Trilochan



  Tutorials

Popular Links

Contact Us

address Plot No-741,2ND Floor
Opp. Bhagabati Temple,Jayadev Vihar
      Bhubaneswar-751013
      Email: info@silantechnology.com
      Phone: 0674-2361252
address
39877, sundale dr, apt#101, Fremont, California 94538, USA
       Phone: +1(262)388-7619

facebook twitter google linked in

© 2018 Silan Technology. All Rights Reserved