Home > Developer > JavaScript
Expression of AngularJS basic learning notes: angularjs learning notes
AngularJS binds data to HTML through expressions.
AngularJS expression
AngularJS expressions are written in double braces: {expression statement }}.
AngularJS expressions bind data to HTML in the same way as ng-bind commands.
AngularJS accurately outputs the expression as the calculation result.
AngularJS expressions have many similarities with JavaScript expressions, including text, operators, and variables. For example, {5 + 5 }}and {firstName + "" + lastName }}
<!DOCTYPE html>If you remove the ng-app command, the expression will be directly displayed on the page rather than computed.
<!DOCTYPE html>AngularJS numbers
AngularJS numbers are the same as JavaScript numbers:
<div ng-app="" ng-init="quantity=1;cost=5"><p>Total in dollar: {{ quantity * cost }}</p></div>Similarly, we can use the ng-bind command to achieve the same effect:
<div ng-app="" ng-init="quantity=1;cost=5"><p>Total in dollar: <span ng-bind="quantity * cost"></span></p></div>Note uses the ng-init command in AngularJS development. In the controller section, you will see better data initialization methods.
AngularJS string
AngularJS string is the same as JavaScript string:
<div ng-app="" ng-init="firstName='John';lastName='Doe'"><p>The name is {{ firstName + " " + lastName }}</p></div>Similarly, we can use the ng-bind command to achieve the same effect:
<div ng-app="" ng-init="firstName='John';lastName='Doe'"><p>The name is <span ng-bind="firstName + ' ' + lastName"></span></p></div>AngularJS object
AngularJS objects are the same as JavaScript objects:
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"><p>The name is {{ person.lastName }}</p></div>Similarly, we can use the ng-bind command to achieve the same effect:
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"><p>The name is <span ng-bind="person.lastName"></span></p></div>AngularJS Array
AngularJS arrays are the same as JavaScript Arrays:
<div ng-app="" ng-init="points=[1,15,19,2,40]"><p>The third result is {{ points[2] }}</p></div>Similarly, we can use the ng-bind command to achieve the same effect:
<div ng-app="" ng-init="points=[1,15,19,2,40]"><p>The third result is <span ng-bind="points[2]"></span></p></div>Comparison between AngularJS expressions and JavaScript expressions
Similar to JavaScript expressions, AngularJS expressions also contain text, operators, and variables. Unlike JavaScript expressions,
AngularJS expressions can be written in HTML.
AngularJS expressions do not support conditions and loop statements, and do not have exception statements.
AngularJS expressions support filters.The above is all the content of this article. I hope you will like it.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
