Expression in AngularJS

Expression is used to bind application data to HTML tags. Expression is written in {{expression}}. Expression has a similar way of operating as the ng-bind directive. The expressions in the AngularJS application are pure JavaScript expressions and the output is the data we use.

Use numbers in Expression in AngularJS:

Bookshelf: {{cost * quantity}} 000 VND

Use strings in Expression in AngularJS:

Hello {{student.firstname + "" + student.lastname}}!

Use objects in Expression in AngularJS:

Student ID: {{student.rollno}}

Use arrays in Expression in AngularJS:

Test Score (Tin): {{marks [3]}}

For example:

Below is an example for the expressions described above:

viduExpression.html



Examples of Expressions in AngularJS

QTM application

 

Hello {{student.firstname + "" + student.lastname}}!


Bookshelf: {{cost * quantity}} 000 VND


Student ID: {{student.rollno}}


Test Score (Tin): {{marks [3]}}





Result

Open the viduExpression.html page on the web browser and see the results below.

Expression in AngularJS Picture 1

According to Tutorialspoint

Previous post: The Directive in AngularJS

Next lesson: Controller component in AngularJS

5 ★ | 1 Vote

May be interested

  • Controller component in AngularJSPhoto of Controller component in AngularJS
    an angularjs application works primarily based on the controller component to control the flow of data in the application.
  • HTML DOM element in AngularJSPhoto of HTML DOM element in AngularJS
    the directives below can be used to bind application data to attributes in the html dom element.
  • The Module in AngularJSPhoto of The Module in AngularJS
    angularjs supports module-oriented approach. the module is used to distinguish the logic, service and application processing ... and make the code clear.
  • Form in AngularJSPhoto of Form in AngularJS
    angularjs complements the form of filling and validation features. you can use ng-click directive to handle the event by clicking on the button and using the flags $ dirty and $ invalid to make it effective. use novalidate with the form declaration to disable the valicate feature of the form. the control section of the form uses an effective set of angularjs events.
  • Include syntax in AngularJSPhoto of Include syntax in AngularJS
    html does not support embedding html web pages in html pages. to achieve this function, the following methods can be used:
  • Ajax in AngularJSPhoto of Ajax in AngularJS
    angularjs provides a $ http control that acts as a service to read data from the server. the server can create calls to the database to receive the logs. angularjs needs data in json format.