AngularJS Expressions

AngularJS Expressions เป็นการคำนวณค่าด้วย AngularJS โดยการคำนวณจะต้องเขียนอยู่ใน {{ }} หรือใช้คำสั่ง ng-bind สามารถกำหนด operators ได้ เช่น + - * /

ตัวอย่าง

<div ng-app="">  <p>My Calculate: {{ 2 + 2 + 2 }}</p></div>

หรือ ใช้คำสั่ง ng-bind

<div ng-app>  <p>My first expression: <span ng-bind="2 + 2 +2"></span></p></div>

ผลลัพธ์ที่ได้เหมือนกัน ดังนี้

My Calculate: 6

การกำหนดค่าคงเริ่มต้นให้กับตัวแปร ด้วยคำสั่ง ng-init

<div ng-app="" ng-init="x=10;y=1">  <p>Result: {{ x * y}}</p></div>

ผลลัพธ์ที่ได้ ดังนี้

Result: 10

การใช้งานกับ String 

<div ng-app="" ng-init="firstName='Jame';lastName='Mars'">  <p>My name is {{ fitstName + " " + lastname }}</p></div>

หรือใช้คำสั่ง ng-bind

<div ng-app="" ng-init="firstName='Jame';lastName='Mars'">  <p>My name is <span ng-bind="firstName + '  ' + lastName"></span></p></div>

จะเห็นว่าใช้ ; แยกระหว่างตัวแปรแต่ละตัว ในที่นี้คือ firstName กับ lastNameผลลัพธ์ที่ได้ ดังนี้

My name is Jame Mars

การใช้งานกับ Object

<div ng-app="" ng-init="cat={name:'kitty',color:'black'}">  <p>My animal is {{ cat.name + cat.color}}</p></div>

การประกาศ Object จะใช้ { } และใช้ , คั่นระหว่างแต่ละ Attribute ในการเรียกใช้งาน Object จะต้อง เรียกชื่อ Object ในที่นี้คือ cat จากนั้นตามด้วย attribute ซึ่งใน object cat ประกอบด้วย Attribute 2 ตัว คือ name และ color

การใช้งานกับ Arrays

<div ng-app="" ng-init="os=[iOS,Android,Windows phone]">  <p>My mobile OS is {{ os[0] }}</p></div>

ผลลัพธ์ที่ได้ ดังนี้

My mobile OS is iOS

จะสังเกตเห็นว่า มีการประกาศ Array (เครื่องหมาย [ ]) ที่ชื่อ os เก็บสมาชิก 3 ตัว โดยสมาชิกตัวแรกใน Array มี index เป็น 0