[AngularJS] Expression: AngularJS 表達式，顯示綁定的資料。
AngularJS 表達式
AngularJS Expression:AngularJS使用表達式來將資料綁定到HTML 。
AngularJS 表達式會寫在雙括號內，如:{{ expression }}，或是寫成指令:ng-bind="expression"。
AngularJS會將處理完的資料顯示在表達式裡，與JavaScript的表達式一樣，包含文字、運算符號與變數。例如:{{ 5 + 5 }} 或是 {{ firstName + " " + lastName }}
AngularJS 表達式:
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="">
<p>五加五等於: {{ 5 + 5 }}</p>
</div>
</body>
</html>
要是將 <div ng-app="">的ng-app=""移除，便會顯示錯誤。因此，必須加入ng-app，定義AngularJS的應用範圍。
也可以使用AngularJS來改變CSS。
如下變更 input box的底色:
<div ng-app="" ng-init="myCol='lightblue'">
<input style="background-color:{{myCol}}" ng-model="myCol" value="{{myCol}}">
</div>
AngularJS 數字運算
AngularJS的數字運算如下:
<div ng-app="" ng-init="NumA=5;NumB=10">
<p>五乘以十等於:{{NumA*NumB}}</p>
</div>
也可以將表達式改寫成指令ng-bind，會得到一樣的效果。
<div ng-app="" ng-init="NumA=5;NumB=10">
<p>五乘以十等於:<span ng-bind="NumA*NumB"></span></p>
</div>
AngularJS 字串
AngularJS的字串如下:
<div ng-app="" ng-init="String1='我是';String2='Berry'">
<p>{{String1+String2}}</p>
</div>
ng-bind的表達式:
<div ng-app="" ng-init="firstName='John';lastName='Doe'">
<p><span ng-bind="String1+ String2"></span></p>
</div>
AngularJS 物件
AngularJS 物件如下:
<div ng-app="" ng-init="Name={Student1:'Berry',Student2:'Hanna'}">
<p>{{Name.Student1}}</p>
</div>
ng-bind的表達式:
<div ng-app="" ng-init="Name={Student1:'Berry',Student2:'Hanna'}">
<p><span ng-bind="Name.Student1"></span></p>
</div>
AngularJS 陣列
AngularJS 陣列如下:
<div ng-app="" ng-init="Point=[1,10,5,15,30]">
<p>陣列中第三個數字為:{{Point[3]}}</p>
</div>
ng-bind的表達式:
<div ng-app="" ng-init="Point=[1,10,5,15,30]">
<p>陣列中第三個數字為<span ng-bind="Point[3]"></span></p>
</div>