Aug 3, 2015

Angular JS Expressions

AngularJS expressions are much like JavaScript expressions, placed inside HTML templates by using double braces such as: {{expression}}. AngularJS evaluates expressions and then dynamically adds the result to a web page. Like JavaScript expressions, they can contain literals, operators, and variables.
There are some valid AngularJS expressions:

  1. {{ 1 + 2 }}
  2. {{ x + y }}
  3. {{ x == y }}
  4. {{ x = 2 }}
  5. {{ user.Id }}

    <!DOCTYPE html>
    <html>
    <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
    <title>AngularJS Expressions</title>
    </head>
    <body ng-app="app">
    <div ng-controller="Ctrl">
      <p>Total Price: <span ng-bind="quantity * price"></span></p>
     
      <p>Full Name: <span ng-bind="firstName + ' ' + lastName"></span></p>
    </div>
     
    <script>
      var app=angular.module("app",[]);
       
      app.controller('Ctrl',function($scope){
          $scope.quantity=5;
          $scope.price=10;
         
          $scope.firstName="Shailendra";
          $scope.lastName="Chauhan";
      });
    </script>
    </body>
    </html>


    Total Price: 50
    Full Name: Shailendra Chauhan


    How AngularJS expressions are different from the JavaScript expressions

    AngularJS expressions are much like JavaScript expressions but they are different from JavaScript expressions in the following ways:
    1. Angular expressions can be added inside the HTML templates.
    2. Angular expressions doesn't support control flow statements (conditionals, loops, or exceptions).
    3. Angular expressions support filters to format data before displaying it.

No comments:

Post a Comment