AngularJS Expressions

In AngularJS, expressions are used to bind the data in the application to the HTML. They are written inside double braces like {{expression}}. Alternatively, these can also be written inside a directive like: ng-bind="expression". The applications in AngularJS are much like JavaScript expressions, and we receive the data as output wherever these expressions are used.

They can contain literals, operators and variables. The differences between the expressions in JavaScript and AngularJS are quite subtle in nature. AngularJS has its own mechanism to parse the expressions that it encounters and find the semantics out of it.

Example: {{ 5 + 5 }} or {{ firstName + " " + lastName }}

These expressions can be written anywhere. AngularJS simply resolves the expression written and returns the result.

Example: Using AngularJS to change the value of CSS properties.

AngularJS Numbers

AngularJS numbers are quite similar to JavaScript numbers. Refer to the code below.

--

AngularJS Strings

AngularJS strings are quite similar to JavaScript strings. Refer to code below.

--

AngularJS Objects

AngularJS objects are quite similar to JavaScript objects. Refer to code below.

--

AngularJS Arrays

AngularJS arrays are quite similar to JavaScript arrays. Refer to code below.

--

What are the differences and similarities between AngularJS Expressions and JavaScript Expressions?

Akin to expressions in JavaScript, AngularJS can contain literals, operators and variables.

JavaScript expressions cannot be written inside the HTML. However, that's not the case with expressions in AngularJS. They can be written inside HTML.

AngularJS expressions are unable to support conditionals, loops, and exceptions. JavaScript expressions can support them.

The expressions in AngularJS can easily support filters, while those in JavaScript cannot.


Therefore, we learnt how to use expressions in AngularJS and its subtle differences with the expressions in JavaScript. In the following tutorial, we will learn more about controllers in AngularJS, which are crucial in any application.