angularjs的表达式怎么用？angularjs的表达式的使用实例
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了angularjs的表达式怎么用？angularjs的表达式的使用实例，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含3579字，纯文字阅读大概需要6分钟。
内容图文
本篇文章主要的向大家讲述了关于angularjs表达式的用法和angularjs的使用实例解释，最后还有AngularJS表达式与JavaScript表达式的区别。现在就让我们一起来看这篇文章吧首先我们来了解下angularjs的表达式怎么用：
ng中的表达式与javascript表达式类似但是不可以划等号，它是ng自己定义的一套模式。表达式可以作为指令的值，如ng-modle=”people.name”、ng-click=”showMe()”，看起来是如此像字符串，故而也叫字符串表达式。也可以在标记中使用表达式，如{{1+2}}，或者与过滤器一起使用{{1+2 | currency}}。在框架内部，字符串不会简单的使用eval()来执行，而是有一个专门的$parse服务来处理。在ng表达式中不可以使用循环语句、判断语句，事实上在模板中使用复杂的表达式也是一个不推荐的做法，这样视图与逻辑就混杂在一起了
我们在使用其他模板库时，一般都会有模板的循环输出、分支输出、逻辑判断等类似的控制。
要想理解指令属性的运作，我们必须先理解表达式。在之前的例子里我们已经见过表达式，例如 {{ user.name }}。
{{ 8 + 1 }} 9
{{ person }} {"name":"Ari Lerner"}
{{ 10 * 3.3 | currency }} $33.00表达式粗略来看有点像 eval(javascript) 的结果。它们会经过Angular.js的处理，从而拥有以下重要而独特的性质：
所有表达式都在scope这个context里被执行，因此可以使用所有本地 $scope 中的变量。
如果一个表达式的执行导致类型错误或引用错误，这些错误将不会被抛出。
表达式里不允许任何控制函数流程的功能（如if/else等条件语句）
表达式可接受一个或多个串联起来的过滤器。（想要看更多关于angularjs的视频，就到PHP中文网AngularJS视频教程栏目学习，里面有你想要的学习视频）
现在来看看angularjs表达式的使用实例：
AngularJS 表达式写在双大括号内：{{ expression }}。
AngularJS 表达式把数据绑定到 HTML，这与 ng-bind 指令有异曲同工之妙。
AngularJS 将在表达式书写的位置"输出"数据。
AngularJS 表达式 很像 JavaScript 表达式：它们可以包含文字、运算符和变量。
实例 {{ 5 + 5 }} 或 {{ firstName + " " + lastName }}
一.AngularJS 数字
<div ng-app="" ng-init="quantity=5;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>初始化参数，并通过ng-bind\表达式绑定并运用数字公式进行计算.
二.AngularJS 字符串
这种形式依然可以用两种方式进行绑定数据:
1.表达式绑定。2.利用ng-bind进行绑定。
例如：
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>姓名： {{ firstName + " " + lastName }}</p>
</div>
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p>姓名： <span ng-bind="firstName + ' ' + lastName"></span></p>
</div>三.我们来看看AngularJS对象：
AngularJS 对象就像 JavaScript 对象：
两种方式绑定：
1.表达式：
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>姓为 {{ person.lastName }}</p>
</div>2.ng-bind绑定
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>姓为 <span ng-bind="person.lastName"></span></p>
</div>AngularJS 数组就像 JavaScript 数组：
两种方式：
1.表达式：
<div ng-app="" ng-init="points=[1,15,19,2,40]">
<p>第三个值为 {{ points[2] }}</p>
</div>2.ng-bind绑定：
<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 表达式支持过滤器。
好了，以上就是本篇关于angularjs表达式使用的文章了（想看更多就到PHP中文网，那里有AngularJS参考手册，可以供大家学习参考），希望对大家有帮助，有问题的可以在下方提问。
【小编推荐】
angularjs过滤器怎么使用？angularjs过滤器使用方法介绍
angularjs的路由原理你知道吗？这里有angularjs路由的详细原理
以上就是angularjs的表达式怎么用？angularjs的表达式的使用实例的详细内容，更多请关注Gxl网其它相关文章！
内容总结
以上是互联网集市为您收集整理的angularjs的表达式怎么用？angularjs的表达式的使用实例全部内容，希望文章能够帮你解决angularjs的表达式怎么用？angularjs的表达式的使用实例所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。