好久沒有寫技術文章了，其主要原因還是因為失業了。。。自己的前端開發技術還是處於一瓶不滿，半瓶晃盪。
然後，由於入行前端的時間太短，又不願意去進行簡歷包裝，最近就開始忙著修改簡歷（總結這半年來學到的關於vue的知識），然後去招聘網站上找工作，然後，發現各個公司的前端崗位需求又五花八門，比如精通angular、react等，我又不會。。。
為了能夠找到新工作，只好去了解下這些新的框架，訪問angular官網後，發現angular已經到了v8，不過聽說angular 2和Angular 1改變很大。然後就有了這一篇angular文章。。。
序言
隨著Angular版本的頻繁推出，有必要了解下AngularJS、 Angular 2、Angular 4 的區別。
字面上的區別（1）我們常說的 Angular 1 是指 AngularJS； 從Angular 2 開始已經改名了。不再帶有JS，只是單純的 Angular；（2）還有一個不可思議的版本變化： 從 Angular 2 直接跳躍到了 Angular 4 ， 咋不見 Angular 3 了呢？
架構上的差別
Angular 1 是一個典型的 MVC 架構 （Model - View - Controller ），相比於 Angular 1 的MVC 架構， Angular 2 是一個典型的基於元件（component) 架構。從這一點上來說，它與 React.js 結構相似。
為何匆忙推出 Angular 2 ？照理說，Angular 1. x 版本已經足夠強大，為什麼還匆匆忙忙推出 Angular 2 呢？這是迫於 mobile apps 的需要。按照慣性的思維： Angular 2 應該是 Angular 1.x 的升級版本，其實不然， Angular 2 與 Angular 1.x 完全不同， 最基本的語法都不一樣。 Angular 1.x 是 基於 JavaScript的框架，而Angular 2 是基於 TypeScript的框架。
所以說，當你決定要學習 Angular 時，要想好是學 Angular 1 還是 Angular 2。 那麼到底學哪個版本好呢？ 這不好講，還得看專案需要。 如果單純地學習，當然是越高的版本越好，與時俱進嘛！
Angular 3 怎麼不見了？Angular 團隊開發 Angular 3時，在router模組上出現了問題， 再三糾結，決定放棄 Angular 3 ，直接奔向了 Angular 4
Angular 2 有什麼好？相比 Angular 1.x， Angular 2 的體積更小，為什麼這麼做，說白了，一個字——快； 如果僅僅用於PC 端的WEB開發， Angular 1.x足以應對； 如果是用於 mobile app ，在使用者體驗方面，略顯捉襟見肘！
Angular 4 有什麼好？Angular 4 是 Angular 2 的升級版本， 也就是說，從 Angular 2之後，它們的版本一脈相承，是升級版本，而不是推到重來的版本。 Angular 4 比 Angular 2 更快。
所以說， 從 Angular 1.x 到 Angular 2 ，再發展到 Angular 4， 其路線就是為了更快一些。
Angular 1寫的程式碼無法用在Angular 2上，這是為什麼？
Angular 1 程式碼是基於 JavaScript 寫的， 程式碼示例：
var angular1 = angular.module('uiroute', ['ui.router']);angular1.controller('CarController', function ($scope) { $scope.CarList = ['Audi', 'BMW', 'Bugatti', 'Jaguar'];});
Angular 2 程式碼 是基於 TypeScript 寫的。 TypeScript與JavaScript 的區別大了去了。 TypeScript 是 JavaScript的超集 （superset）。 看一段 Angular 2 程式碼：
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";import { AppModule } from "./app.module";platformBrowserDynamic().bootstrapModule(AppModule); import { NgModule } from "@angular/core"; import { BrowserModule } from "@angular/platform-browser"; import { AppComponent } from "../app/app.component"; @NgModule({ imports: [BrowserModule], declarations: [AppComponent], bootstrap: [AppComponent] }) export class AppModule { } import { Component } from '@angular/core' @Component({ selector: 'app-loader', template: ` <div> <div> <h4>Welcome to Angular with ASP.NET Core and Visual Studio 2017</h4></div></div>` }) export class AppComponent{}如果不熟悉 TypeScript 語法，上面這段程式碼不知所云！ 既然差異這麼大，把 Angular 1 升級到 Angular 2 難度之大，可以預見！
這麼看來， Angular 1 與 2 的差別，並不是什麼框架上的差別，而是它們的語法完全不一樣， 一個用JavaScript，一個用 TypeScript。 那為什麼Angular 4 是 Angular 2 的升級版呢？ 答案很簡單， 因為 4和2 用的都是 TypeScript 用法！
程式碼重用方法在 Angular 1 中，最為常用的是 $scope 在 Angular 2和4中被去掉了。在新版本中，更多推崇的是 directive 和 controller, 通過對 component 元件的split（分割），從而實現程式碼的複用。
對 Mobile app 的支援Angular 1的設計初衷是為了實現響應式網頁、雙向資料繫結的Web應用，如果從Html5的概念來看，Angular 1 算是一個很好的支援H5的前端框架了。 如果我們對Angular 有更高的期望，那就是希望Angular 能很好地支援 mobile app，達到APP 原生的使用者體驗效果。 而這正是 Angular 1 的短板，鑑於詞，才推出了 Angular 2 及其後來的Angular 4。
接下來，我們重點談談 Angular 2 的架構
Angular 2 架構可以說， Angular 2 是面向 mobile app 的架構，為了達到APP 原生的效果， Angular 2 特有引入了 NativeScript 技術。
如何解決APP 跨平臺問題Angular 2 解決了 mobile app 跨平臺的問題， 所謂跨平臺是指，用 Angular 2 編寫的 Web 在 iOS 和 Android 上能達到同等原生的使用者體驗效果，只需要編寫一套程式碼。
小結如果你是剛接觸 Angular 開發，建議從 Angular 2 開始，相對要簡單些； 當然現在最新版本已經是8.2.11，可以直接從8開始，Angular JS （也就是angular 1直接可以忽略了）另外使用cli開發的話，@Angular/cli也到了8.3.12。