1.下載angularjs
進入其官網下載:https://angularjs.org/,建議下載最新版的:https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.js
所有版本:https://code.angularjs.org/
2.示例1
HelloWorld !
新建一個helloworld.html
<!doctype html> <html ng-app> <head> <script src="angular.js"></script> </head> <body> Hello {{'World'}}! </body> </html>
然后將下載的angular.js拷到與helloworld.html的同一目錄
效果如下所示:
3.helloworld.html代碼說明
標記ng-app告訴AngularJS處理整個HTML頁並引導應用：
<htmlng-app>
注意，使用雙大括號標記{{}}的內容是問候語中綁定的表達式，這個表達式是一個簡單的字符串‘World’。
Hello {{'World'}}!
4.示例2
本示例演示AngularJS的雙向數據綁定（bi-directional data binding）：
- 編輯前面創建的helloworld.html文檔。
- 將下面的源代碼復制到您的HTML文件。
- 刷新瀏覽器窗口。
源代碼
<!doctype html> <html ng-app> <head> <script src="angular.js"></script> </head> <body> Your name: <input type="text" ng-model="yourname" placeholder="World"><hr> Hello {{yourname || 'World'}}! </body> </html>
效果:
該示例有一下幾點重要的注意事項：
- 文本輸入指令
<input ng-model="yourname" />綁定到一個叫yourname的模型變量。 - 雙大括號標記將
yourname模型變量添加到問候語文本。 - 你不需要為該應用另外注冊一個事件偵聽器或添加事件處理程序！
現在試着在輸入框中鍵入您的名稱，您鍵入的名稱將立即更新顯示在問候語中。 這就是AngularJS雙向數據綁定的概念。 輸入框的任何更改會立即反映到模型變量（一個方向），模型變量的任何更改都會立即反映到問候語文本中（另一方向）。
5.angularjs框架簡介
模板（Templates）
模板是您用HTML和CSS編寫的文件，展現應用的視圖。 您可給HTML添加新的元素、屬性標記，作為AngularJS編譯器的指令。 AngularJS編譯器是完全可擴展的，這意味着通過AngularJS您可以在HTML中構建您自己的HTML標記！
應用程序邏輯（Logic）和行為（Behavior）
應用程序邏輯和行為是您用JavaScript定義的控制器。AngularJS與標准AJAX應用程序不同，您不需要另外編寫偵聽器或DOM控制器，因為它們已經內置到AngularJS中了。這些功能使您的應用程序邏輯很容易編寫、測試、維護和理解。
模型數據（Data）
模型是從AngularJS作用域對象的屬性引申的。模型中的數據可能是Javascript對象、數組或基本類型，這都不重要，重要的是，他們都屬於AngularJS作用域對象。
AngularJS通過作用域來保持數據模型與視圖界面UI的雙向同步。一旦模型狀態發生改變，AngularJS會立即刷新反映在視圖界面中，反之亦然。
6.ubuntu 12.04下安裝nodejs、npm和karma
1）安裝nodejs
直接輸入命令sudo apt-get install nodejs 安裝的是0.6版本的,這個會出現問題,導致接下來安裝js測試工具karma,出現問題.
所以用下載安裝自己編譯的方式,http://nodejs.org/download/,我這里下載的是http://nodejs.org/dist/v0.10.26/node-v0.10.26.tar.gz
然后,執行命令
tar zxvf node-v0.10.26.tar.gz cd node-v0.10.26 ./configure make sudo make install
這樣直接編譯會出錯!!
必須先把其依賴環境搭建好,必須先執行如下命令:
sudo apt-get install g++ curl libssl-dev apache2-utils sudo apt-get install git-core
git如果已經安裝則不需要再安裝了.
當然也可從github上直接clone了,即使用如下命令:
git clone git://github.com/ry/node.git cd node ./configure make sudo make install
測試是否成功???
amosli@amosli-pc:~$ node --version v0.10.26
查看版本是否正確,這里是正確的.
2)安裝npm
sudo apt-get install npm
3)安裝karma
sudo npm install -g karma
只要安裝nodejs正確,那么后兩步將會十分順利.
否則安裝karma時將會報如下的錯誤:
amosli@amosli-pc:~$ sudo npm install -g karma npm http GET https://registry.npmjs.org/karma npm ERR! Error: failed to fetch from registry: karma npm ERR! at /usr/share/npm/lib/utils/npm-registry-client/get.js:139:12 npm ERR! at cb (/usr/share/npm/lib/utils/npm-registry-client/request.js:31:9) .....
karma以前叫testacular,是js的測試框架.
安裝nodejs時參考了:http://howtonode.org/how-to-install-nodejs
如果還報錯,那么可以執行以下命令試試,注冊npm:
npm config set registry http://registry.npmjs.org/