What is AngularJS Expressions

 

 

Using Expressions, AngularJS binds data to HTML at the location wherever expression is mentioned on web page. It can be written inside double braces {{expression}}. It can also be written in different way like ng-bind=”expression”. ng-bind maps innerHTML to the value of expression.

Let’s take an example of a HTML paragraph with expression which are equivalent:

{{ 5+5 }}

OR

As already mentioned, AngularJS resolves expression and return the result exactly where expression is written. They can contain literals, operators and variables.




Example # 1

Output:

Sum of 10 and 20 is 30

Mentioning ng-app is important otherwise expression will not be calculated and output will be printed as

Sum of 10 and 20 is {{ 10 + 20 }}




Example # 2

Output:

Dear Satyendra Mishra,

Mature amount of your deposit amount 100 on simple rate of interest 8% for 2 years will be 16.

AngularJS Objects




Example # 3

You can also create objects called as AngularJS Objects

Output:

Dear Satyendra Mishra,

Mature amount of your deposit amount 100 on simple rate of interest 8% for 2 years will be 16.

AngularJS Arrays

Example # 4

AngularJS Arrays are initializes using ng-init in the format provided in below example. There is also a magic on select control, if you change selected item last statement of this example changes.

Output:

Additional Notes

  • AngularJS expressions do not support conditionals, loops, and exceptions, while JavaScript expressions do.
  • AngularJS expressions support filters, while JavaScript expressions do not.

 




Be Connected…

Satyendra

 

THREE QUERIES offers easy access to information about SharePoint and associated technologies, project management, agile and scrum methodologies that helps developers, administrators, architects, technical managers, business analysts and end users. It has grown from there. We provide an important knowledge base for those involved in managing, architecture and developing software projects of all kinds. With weekly/daily exclusive updates, we keep you in touch with the latest business, management, technology thinking.

WE ARE CONNECTED ~ Follow us on social media to get regular updates and opinion on what's happening in the world of SharePoint, front-end, back end web technologies and project management. If you like this article, please share it and follow us at Facebook, Twitter, Instagram, Pinterest and LinkedIn

About Satyendra Mishra

Microsoft certified, motivated, energetic and accomplished SharePoint Consultant and Architect with 13+ years of work experience in Management, Architecture, Analytics, Development and Maintenance. He has been fortunate to be a part of over 20+ Web/Mobile/Software SharePoint and .Net projects delivery with various companies across different industry sectors. This has provided him a valuable insight and experience especially in successful implementation of technology solutions. Having very strong System Architecture, Technological, Management & Analytical Skills, Knowledge of Office 365, SharePoint, .Net, JavaScript, React, Angular, Azure, SQL. In 2016, he decided to start sharing the knowledge back to society in the form for content writing and blogging.
View all posts by Satyendra Mishra →

Leave a Reply

Your email address will not be published. Required fields are marked *