Latest web development tutorials

AngularJS expression

AngularJS use expressions to bind data to HTML.


AngularJS expression

AngularJS expressions written in curly brackets: {{expression}}.

AngularJS expression to bind the data to HTML, which ng-bind command has the same purpose.

AngularJS expression in the writing position "output" data.

AngularJS expressions like JavaScript expressions: they can contain text, operators, and variables.

Examples 5 + 5 {{}} or {{firstName + "" + lastName}}

AngularJS examples

<! DOCTYPE html>
<Html>
<Head>
<Meta charset = "utf-8 ">
<Script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
</ Head>
<Body>

<Div ng-app = "" >
<P> My first expression: {{5 + 5}} </ p>
</ Div>

</ Body>
</ Html>

try it"

AngularJS digital

AngularJS JavaScript digit numbers like:

AngularJS examples

<div ng-app="" ng-init="quantity=1;cost=5">

<p>总价: {{ quantity * cost }}</p>

</div>

try it"

Use the same instance ng-bind:

AngularJS examples

<div ng-app="" ng-init="quantity=1;cost=5">

<p>总价: <span ng-bind="quantity * cost"></span></p>

</div>

try it"

Note Use ng-init is not very common. You will learn to be a better way to initialize the data in the controller chapter.

AngularJS string

AngularJS JavaScript string string like:

AngularJS examples

<div ng-app="" ng-init="firstName='John';lastName='Doe'">

<p>姓名: {{ firstName + " " + lastName }}</p>

</div>

try it"

Use the same instance ng-bind:

AngularJS examples

<div ng-app="" ng-init="firstName='John';lastName='Doe'">

<p>姓名: <span ng-bind="firstName + ' ' + lastName"></span></p>

</div>

try it"


AngularJS objects

AngularJS objects like JavaScript objects:

AngularJS examples

<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">

<p>姓为 {{ person.lastName }}</p>

</div>

try it"

Use the same instance ng-bind:

AngularJS examples

<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">

<p>姓为 <span ng-bind="person.lastName"></span></p>

</div>

try it"


AngularJS array

AngularJS JavaScript array as an array:

AngularJS examples

<div ng-app="" ng-init="points=[1,15,19,2,40]">

<p>第三个值为 {{ points[2] }}</p>

</div>

try it"

Use the same instance ng-bind:

AngularJS examples

<div ng-app="" ng-init="points=[1,15,19,2,40]">

<p>第三个值为 <span ng-bind="points[2]"></span></p>

</div>

try it"

AngularJS JavaScript expression and expression

Similar to JavaScript expressions, AngularJS expressions can contain letters, operators, variables.

JavaScript with different expressions, AngularJS expression can be written in HTML.

JavaScript with different expressions, AngularJS expression does not support conditional, circulation and anomalies.

JavaScript expressions and different, AngularJS expression support filters.