Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Difference between AngularJS Expression and JavaScript Expression

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 2.17k
    Comment on it

    These are the following differences between Angular JS expression and JavaScript expression : 

     

    1. Used in HTML : Angular expressions can be used inside HTML while JavaScript expressions do not. 
    2. Filters : Angular expressions works with filters while JavaScript expressions do not.
    3. Context : Angular expressions do not have direct access of global variables while JavaScript expressions have direct access. Global variables are window , document or location . The benefit of this in AngularJS is it prevent from accidental access to the global state.
    4. Forgiving : Angular JS forgiving the undefined and null for evaluated expression, while in JavaScript, it generates ReferenceError or TypeError.
    5. No Control Flow Statements : We cannot use control flow statements in angular expression. We can use only ternary operator. 
    6. No function declarations : We cannot declare functions in Angular expression while in JavaScript expression we can do.
    7. No RegExp Creation With Literal Notation : We cannot create regular expression in Angular expression while in JavaScript expression we can do.
    8. No Comma And Void Operators : In Angular expression, we cannot use comma or void operators. 
    9. One time binding : Angular JS supports one time binding. If you use :: in an expression , then it will create one time binding. The benefit of one time binding is it reduce the  number of expression being watched that makes the digest loop faster that improved the final result performance. It also free the resources once binding is stabilized. It is used when we do not require to change value once its set.

     

    Example of one time binding:

    <h2>One Time Binding Example</h2>
    <body ng-app="oneTimeBidingExampleApp">
        <div ng-controller="ctrl">
            <button ng-click="getCity($event)">Get City</button>
            <p>One time binding: {{::name}}</p>
            <p>Without one time binding: {{name}}</p>
        </div>
    </body>
    
    @Scripts.Render("~/bundles/angularjquery")
    <script>
        angular.module('oneTimeBidingExampleApp', []).
    controller('ctrl', ['$scope', function ($scope) {
        var counter = 0;
        var names = ['Dehradun', 'Noida', 'Chandigarh', 'Gurgoan'];
        $scope.getCity = function (clickEvent) {
            $scope.name = names[counter % names.length];
            counter++;
        };
    }]);
    </script>

     

    OUTPUT : 

    Hope this blog will help you . Thanks

     

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: