AngularJS 表达式

最新推荐文章于 2020-07-28 10:22:16 发布

KrissLong

最新推荐文章于 2020-07-28 10:22:16 发布

阅读量160

点赞数

分类专栏： AngularJS 文章标签： Angular

本文链接：https://blog.youkuaiyun.com/KrissLong/article/details/89350467

版权

AngularJS 专栏收录该内容

5 篇文章

订阅专栏

本文详细介绍了AngularJS中四种类型的表达式使用方法，包括数字、字符串、对象和数组的处理方式，并对比了AngularJS与JavaScript表达式的异同，强调了AngularJS表达式在HTML中的独特应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

AngularJS 表达式

第一种：数字

<div ng-app="" ng-init="quantity=1;cost=5">
 	<p>总价：{{quantity*cost}}  </p>
 </div>

 <div ng-app="" ng-init="quantity=1;cost=5">
 	<p>总价：<span ng-bind="quantity*cost"></span></p>
 </div>

第二种：字符串

 <div ng-app="" ng-init="firstName='John';lastName='Doe'">
 	<p>姓名：{{ firstName + " " + lastName }}</p>
 </div>

 <div ng-app="" ng-init="firstName='John';lastName='Deo'">
 	<p>姓名：<span ng-bind="firstName+' '+lastName"></span></p>
 </div>

第三种：对象

<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
 	<p>姓名：{{ person.lastName }}</p>
 </div>

 <div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
 	<p>姓名：<span ng-bind="person.lastName"></span></p>
 </div>

第四种：数组

 <div ng-app="" ng-init="points=[1,15,19,2,40]">
 	<p>第三个值为：{{ points[2] }}</p>
 </div>

 <div ng-app="" ng-init="points=[1,15,19,2,40]">
 	<p>第三个值为：<span ng-bind="points[2]"></span></p>
 </div>

AngularJS与JavaScript表达式对比

类似于 JavaScript 表达式，AngularJS 表达式可以包含字母，操作符，变量。
与 JavaScript 表达式不同，AngularJS 表达式可以写在 HTML 中。
与 JavaScript 表达式不同，AngularJS 表达式不支持条件判断，循环及异常。
与 JavaScript 表达式不同，AngularJS 表达式支持过滤器。