當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
AngularJS快速入门指南03：表达式
生活随笔
收集整理的這篇文章主要介紹了
AngularJS快速入门指南03：表达式
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
AngularJS通過表達式將數據綁定到HTML。
AngularJS表達式
AngularJS表達式寫在雙大括號中：{{ 表達式語句 }}。
AngularJS表達式綁定數據到HTML的方式與ng-bind指令的方式相同。
AngularJS會準確地將表達式“輸出”為計算的結果。
AngularJS表達式與JavaScript表達式有許多相似之處，它們都包含文字、運算符和變量。例如{{ 5 5 }}和{{ firstName " " lastName }}
<!DOCTYPE html> <html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <body><div ng-app=""><p>My first expression: {{ 5 5 }}</p> </div>運行
如果你去掉ng-app指令，表達式會被直接顯示在頁面上而不會被計算。
<!DOCTYPE html> <html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <body><div><p>My first expression: {{ 5 5 }}</p> </div></body> </html>運行
AngularJS數字
AngularJS數字和JavaScript數字一樣：
<div ng-app="" ng-init="quantity=1;cost=5"><p>Total in dollar: {{ quantity * cost }}</p></div>運行
同樣，我們可以使用ng-bind指令達到相同的效果：
<div ng-app="" ng-init="quantity=1;cost=5"><p>Total in dollar: <span ng-bind="quantity * cost"></span></p></div>運行
| 使用ng-init指令在AngularJS開發中非常普遍。在控制器一節中你將會看到更好的初始化數據的方法。 |
AngularJS字符串
AngularJS字符串與JavaScript字符串一樣：
<div ng-app="" ng-init="firstName='John';lastName='Doe'"><p>The name is {{ firstName " " lastName }}</p></div>運行
同樣，我們可以使用ng-bind指令達到相同的效果：
<div ng-app="" ng-init="firstName='John';lastName='Doe'"><p>The name is <span ng-bind="firstName ' ' lastName"></span></p></div>運行
AngularJS對象
AngularJS對象與JavaScript對象一樣：
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"><p>The name is {{ person.lastName }}</p></div>運行
同樣，我們可以使用ng-bind指令達到相同的效果：
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"><p>The name is <span ng-bind="person.lastName"></span></p></div>運行
AngularJS數組
AngularJS數組與JavaScript數組一樣：
<div ng-app="" ng-init="points=[1,15,19,2,40]"><p>The third result is {{ points[2] }}</p></div>運行
同樣，我們可以使用ng-bind指令達到相同的效果：
<div ng-app="" ng-init="points=[1,15,19,2,40]"><p>The third result is <span ng-bind="points[2]"></span></p></div>運行
AngularJS表達式與JavaScript表達式比較
與JavaScript表達式相同，AngularJS表達式也包含文字、運算符和變量。與JavaScript表達式不同的是，
- AngularJS表達式可以寫在HTML里面。
- AngularJS表達式不支持條件和循環語句，而且沒有exception語句。
- AngularJS表達式支持過濾器。
?
更多專業前端知識，請上 【猿2048】www.mk2048.com
總結
以上是生活随笔為你收集整理的AngularJS快速入门指南03：表达式的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： AngularJS快速入门指南15：AP
- 下一篇： JS对象操作