Angular 簡易介紹

AngularJS

它是由 Google 開發的，一個開源的 JavaScript 框架，是一個單頁式架構(SPA) 簡單來說就是最終只有一個頁面，透過JS更新資料，處理畫面更新等等。
因開放原始碼，更吸收了廣大社群，不同的意見、測試、回饋不斷更新進步到至今，目前已經到了 Angular 4。

基本特性

1.MVVM 架構：

控制器 (Controllers) 與 檢視 (Views) 分離的非常乾淨，以注入方式後實作，實現了關注點分離方式。

2.雙向資料繫結 Two Way Data-Binding：

非常實用的功能之一，資料如果發生變化的話立即反映至畫面更新，對於開發人員而言只須關注在於資料操作即可。
例如：

<script>
  angular.module('Example', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.name = 'Hello Word';
    }]);
</script>
<input type="text" ng-model="name" />

預設 name 值為 Hello Word 當 controller 載入後 input 將綁定預設值，
如在瀏覽器畫面中的 input 中輸入任何字元，也會即時寫入 name 變數中，
或者透過 web api 等等方式取直後放入 name 中，也會即時反應至畫面中，減少了Get Set 值得動作相當實用。

3.依赖注入

只需要在需要地方注入即可使用
例如 模組 (Module) 、 工廠 (factory) 、 服務 (service) 、 提供者 (provider) 、 常數值 (value) 等等。

4.指令

Html DOM元素上的方式，使DOM能有特殊行為
例如，ng-mode, ng-repeat, ng-show, ng-If ... 等等

Angular 2 ~ 4

Angular 2 開始之後，可以說是完全另一個面貌，之間發生了巨大變化

變化一

整體速度與效能的提升

變化二

預設使用 TypeScript 強化了弱型別的 JavaScript，在編譯時期就能做型別檢查，提升程式碼品質。

變化三

Angular 2 直接內建了一套路由機制，簡單的設定就能達到單頁式架構，換頁瀏覽網站的功能。
(Angular 1.x 雖然也內建了一套路由機制，但對於多層路由不支援，功能較簡陋，以至於必須仰賴第三方套件 ui-route)