Angular 2 教學

Angular2 是一款開源JavaScript庫,由Google維護,用來協助單一頁面應用程式執行。

Angular2 是 Angular 1.x 的升級版本,效能上得到顯著的提高,能很好的支援 Web 開發元件。

Angular2 釋出於2016年9月份,它是基於ES6來開發的。


學習本教學需要的基礎知識

學習本教學前,你需要具備基本的前端基礎:HTML、CSS、JavaScript。此外你還需要了解 NPM 及 TypeScript。


Angular2.x與Angular1.x 的區別

Angular2.x與Angular1.x 的區別類似 Java 和 JavaScript 或者說是雷鋒與雷峰塔的區別,所以在學習Angular2.x時大家需要做好重新學習一門語言的心裡準備。


執行條件!

由於目前各種環境(瀏覽器或 Node)暫不支援ES6的程式碼,所以需要一些shim和polyfill(IE需要)讓ES6寫的程式碼能夠轉化為ES5形式並可以正常執行在瀏覽器中。

從上圖可以看出在 Es5 瀏覽器下需要以下模組載入器:

  • systemjs - 通用模組載入器,支援AMD、CommonJS、ES6等各種格式的JS模組載入。

  • es6-module-loader - ES6模組載入器,systemjs會自動載入這個模組。

  • traceur - ES6轉碼器,將ES6程式碼轉換為當前瀏覽器支援的ES5程式碼,systemjs會自動載入 這個模組。


相關參考檔案