Types of Expressions with Example in AngularJS

Last Reply 2 months ago By dharmendr

Posted 2 months ago

What are the ypes of Expressions can we do in AngularJS.

Can you please explain with example for implementation.

Posted 2 months ago Modified on 2 months ago

Hi rani,

The expression is something which we write to perform or achieve some task like Addition of two numbers, string concatenation, etc.

Below are the types of Expressions in AngularJS.

  1. Number Expressions
  2. String Expressions
  3. Object Expressions
  4. Array Expressions

Number Expressions

If any expression is using the number and the operators like +, -, *, % etc. those expressions is called as number expressions.

String Expressions

The string expression is used perform operations on string values.

Object Expressions

The object expressions used to hold object properties and evaluates when displaying.

Array Expressions

The array expressions are used to hold an array of object values.

Example

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Types of Expressions in AngularJS</title>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.min.js"></script>
    <script type="text/javascript">
        var app = angular.module('MyApp', [])
        app.controller("MyController", function ($scope) {
            $scope.Number1 = 50;
            $scope.Number2 = 60;
            $scope.String1 = "Welcome to";
            $scope.String2 = "aspsnippets.com";
            $scope.String3 = "aspforums.net";
            $scope.Customer = { Name: 'Mudassar Khan', City: 'Mumbai', Country: 'India' };
            $scope.Result = [['English', 'Mathmatics', 'Physics', 'Chemistry'], [80, 99, 85, 83]];
        });
    </script>
</head>
<body>
    <div ng-app="MyApp" ng-controller="MyController">
        <h3><u>Number Expression</u></h3>
        <span>Sum of Number1 and Number2 is : </span><b>{{Number1 + Number2}}</b><br />
        <span>Multiplication of Number1 and Number2 is : </span><b>{{Number1 * Number2}}</b>
        <h3><u>String Expression</u></h3>
        {{String1+" "+String2}}<br />
        {{String1}} {{String3}}
        <h3><u>Object Expression</u></h3>
        <span>Name : </span><b>{{Customer.Name}}</b><br />
        <span>City : </span><b>{{Customer.City}}</b><br />
        <span>Country : </span><b>{{Customer.Country}}</b>
        <h3><u>Array Expression</u></h3>
        <span>{{Result[0][0]}} : </span><b>{{Result[1][0]}}</b><br />
        <span>{{Result[0][1]}} : </span><b>{{Result[1][1]}}</b><br />
        <span>{{Result[0][2]}} : </span><b>{{Result[1][2]}}</b><br />
        <span>{{Result[0][3]}} : </span><b>{{Result[1][3]}}</b>
    </div>
</body>
</html>

Demo