標籤：初始化 body angularjs 作用 bind hid click als check
1.什麼是AngularJs
AngularJs 誕生於2009年，由Misko Hevery 等人建立，後被Google收購，是一個優秀的Js架構，用於SPA（single page application）適用於以資料操作比較頻繁的應用程式。
2.AngularJs的四大特性
①採用MVC設計模式
②雙向資料繫結
③依賴注入
④模組化設計
主要從這四個特性出發學習AngularJs的應用。但是前提是要先明白AngularJs的運算式和指令，不先學變數，怎麼去寫函數。
3.運算式和指令
3.1 準備工作
在開始學習之前，先下載AngularJs的架構，我現在學習的是1.4版本，儘管2版本已經出來了，但是1.4的版本還是有許多人在用的。下載完成後，在頁面中<head>標籤中引用。同時，這裡需要提前學習一下兩個指令：ng-app 和 ng-init
ng-app：①指定作用範圍②自動載入並啟動ng，用在html或者body標籤。ng-app只識別第一個，所以一般放在body或者html中，即：
<html ng-app>
ng-init ：初始設定變數
<div ng-init="a=3"></div>
3.2 運算式
運算式的文法：{{運算式}}
作用：在當前位置輸出當前表單時結果
<p>{{3+4}}</p>
如果你已經引入angular.js檔案，並設定html或body為ng-app，那麼在頁面中會計算運算式的值，輸出7
3.3指令
AngularJS 通過被稱為 指令 的新屬性來擴充 HTML，通過內建的指令來為應用添加功能， 允許你自訂指令（後面會學習）。
AngularJS 指令是擴充的 HTML 屬性，帶有首碼 ng-。
常用的指令：ngApp、ngRepeat、ngIf、ngShow、ngHide、ngClick、ngChecked、ngDisabled、ngSrc等等。
常用指令的幾個注意事項：
1) ng-bind指令：用來將運算式的值輸出到當前元素的innerHTML中，如果說出現閃動情況時(ng-init)用，但一般不用
2) no-repeat:迴圈，把no-repeat放在哪個標籤裡，就重複哪個標籤。如果是對象時，可以寫成(key,value) in list
如左圖，迴圈輸出一個數組的值到列表中，右圖為結果
但是當數組中有重複的數字時，這種方法就會報錯了，如下：
通過track by $index 方法輸出重複變數，如下：
3) ng-if:判斷運算式的值，為true時顯示在DOM樹上，為false時不顯示
AngularJs學習筆記1——入門知識
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
