angularJS開發環境搭建和啟動


            本文目錄:1.angularJS框架簡介

                              2.angularJS環境搭建

                              3.啟動一個項目

 

1.angularJS框架簡介

AngularJS是一個開發動態Web應用的框架。它讓你可以使用HTML作為模板語言並且可以通過擴展的HTML語法來使應用組件更加清晰和簡潔。它的創新之處在於,通過數據綁定和依賴注入減少了大量代碼,而這些都在瀏覽器端通過JavaScript實現,能夠和任何服務器端技術完美結合。

Angular是為了擴展HTML在構建應用時本應具備的能力而設計的。對於靜態文檔,HTML是一門很好的聲明式的語言,但對於構建動態WEB應用,它無能為力。所以,構建動態WEB應用往往需要一些技巧才能讓瀏覽器配合我們的工作。

通常,我們通過以下手段來解決動態應用和靜態文檔之間不匹配的問題:

  • 類庫 - 一些在開發WEB應用時非常有用的函數的集合。你的代碼起主導作用,並且決定何時調用類庫的方法。例如:jQuery等。
  • 框架 - 一種WEB應用的特殊實現,你的代碼只需要填充一些具體信息。框架起主導作用,並且決定何時調用你的代碼。例如:knockoutember等。

Angular另辟蹊徑,它嘗試去擴展HTML的結構來彌合以文檔為中心的HTML與實際Web應用所需要的HTML之間的鴻溝。Angular通過指令(directive)擴展HTML的語法。例如:

  • 通過{{}}進行數據綁定。
  • 使用DOM控制結構來進行迭代或隱藏DOM片段。
  • 支持表單和表單驗證。
  • 將邏輯代碼關聯到DOM元素上。
  • 將一組HTML做成可重用的組件。

參考:http://www.angularjs.net.cn/tutorial/1.html

2.angularJS環境搭建

2.1安裝node.js

下載地址:https://nodejs.org/en/download/

2.2.安裝npm和cnpm

npm在安裝node.js會順帶安裝好,由於Angular CLi的一些資源被牆掉了,所以這里我們使用淘寶的鏡像去下載安裝,否則會很慢並且很容易出問題。 

安裝淘寶鏡像,輸入 npm install -g cnpm –registry=https://registry.npm.taobao.org

2.3安裝完成cnpm之后,我們開始安裝Angular-cli。

執行命令
cnpm i -g angular-cli
然后可以執行ng version命令,查看是否安裝完成和angular-cli的版本
安裝完成之后我們就可以使用ng命令,下面開始創建項目。

3.安裝完成之后,我們開始進行測試創建項目。

3.1執行命令:ng new JustForTest

3.2創建好后我們啟動
執行命令:ng serve

這樣就可以直接啟動項目,我們在瀏覽器中輸入:http://localhost:4200可以直接訪問

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM