Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • AngularJs Expressions

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 251
    Comment on it

    Expression in Angular Js are same like JavaScript i.e they also have literals, operators, and variables. Expression in Angular Js can  be written inside curly braces (example: {{ expression }} ) and can also be written inside a directive (example: ng-bind="expression”). AngularJs resolves the problem given in expression and return the result where the expression is defined.

    For Example :

    <!DOCTYPE html>
    <html>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <body>
    
    <div ng-app="">
     <p>My first expression: {{ 15 + 15 }}</p>
    </div>
    
    </body>
    </html>

    The output of above example will be 30.

    In AngularJs we can also change the value of CSS properties.

    For Example:

    <p>Change the colour of text inside input field:</p>
    
    <div ng-app="" ng-init="myTxt='red'">
    
    <input style="color:{{myTxt}}" ng-model="myTxt" value="{{myTxt}}">

    Expression inside a directive:

    <div ng-app="" ng-init="a=1;b=5">
    <p>Total is: <span ng-bind="a+b"></span></p>
    </div>

    Angular JS String:

    We can show strings in an expression:

    For Example:

    <div ng-app="" ng-init="firstName='John';lastName='Doe'">
    <p>My Name is: <span ng-bind="firstName + ' ' + lastName"></span></p>
    </div>

    Important : We cannot remove ng-app directive else the expression will not work. They will display the expression as it is as a string.

     

                                                                         Happy Coding..!

 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: