Angular Expressions
AngularJS Expressions
AngularJS binds information to HTML using Expressions.
AngularJS Expressions
AngularJS expressions tin live written within double braces:{{ expression }}.AngularJS expressions tin too live written within a directive:
ng-bind="expression".AngularJS volition resolve the expression, in addition to furnish the upshot precisely where the facial expression is written.
AngularJS expressions are much similar JavaScript expressions: They tin incorporate literals, operators, in addition to variables.
Example {{ v + v }} or {{ firstName + " " + lastName }}
Example
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="">
<p>My root expression: {{ v + v }}</p>
</div>
</body>
</html>
ng-app directive, HTML volition display the facial expression every bit it is, without solving it: Example
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div>
<p>My root expression: {{ v + v }}</p>
</div>
</body>
</html>
Example: Let AngularJS alter the value of CSS properties.
Change the color of the input box below, past times changing its value:
Example
<div ng-app="" ng-init="myCol='lightblue'">
<input style="background-color:{{myCol}}" ng-model="myCol" value="{{myCol}}">
</div>
AngularJS Numbers
AngularJS numbers are similar JavaScript numbers:Example
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total inward dollar: {{ quantity * terms }}</p>
</div> ng-bind:Example
<div ng-app="" ng-init="quantity=1;cost=5">
<p>Total inward dollar: <span ng-bind="quantity * cost"></span></p>
</div> Using
ng-init is non rattling common. You volition larn a improve means to initialize information inward the chapter nearly controllers.AngularJS Strings
AngularJS strings are similar JavaScript strings:Example
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The get upwards is {{ firstName + " " + lastName }}</p>
</div> ng-bind:Example
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>The get upwards is <span ng-bind="firstName + ' ' + lastName"></span></p>
</div> AngularJS Objects
AngularJS objects are similar JavaScript objects:Example
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The get upwards is {{ person.lastName }}</p>
</div> ng-bind:Example
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>The get upwards is <span ng-bind="person.lastName"></span></p>
</div> AngularJS Arrays
AngularJS arrays are similar JavaScript arrays:Example
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The tertiary upshot is {{ points[2] }}</p>
</div> ng-bind:Example
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>The tertiary upshot is <span ng-bind="points[2]"></span></p>
</div> 
Comments
Post a Comment