Angular 4.x 修仙之路

時間  2019-11-06
標籤 angular 4.x 修仙 之路 欄目 AngularJS 简体版
原文   原文鏈接
閱讀 Angular 6/RxJS 最新教程，請訪問全棧修仙之路

本人的全棧修仙之路訂閱號，會按期分享 Angular、TypeScript、Node.js/Java 、Spring 相關文章，歡迎感興趣的小夥伴訂閱哈！node

fer_road_qrcode

近期回答了 SF 上和 QQ 羣裏面的一些問題，發現一些問題對初學者來講，均可能會遇到。我的精力有限，建了個羣有興趣的朋友能夠加一下 QQ 羣：Angular 修仙之路(1)羣 - 153742079 (已滿)，請加 Angular 修仙之路(2)羣 - 648681235。此外該文章也會持續更新，但願有興趣的讀者多提建議哈，謝謝！git

首先自我介紹一下：我不是"大神"，由於還在修仙中哈。下面是在學習 Angular 過程當中整理的學習筆記，但願對你們能有所幫助，更詳細和更權威的學習資源，請你們閱讀官方文檔。另外，本系列的出發點是從點到面的思路，把 Angular 中的知識點打散掉，而後逐一介紹，儘可能會使用簡單的示例，讓你們基礎掌握每一個知識點，最後纔會經過具體實例把知識點串起來。(不喜歡該方式的讀者，請見諒哈)

Spring 技術棧

工具篇

Spring boot 2.x

Spring Security 5.2.x

Angular 6.x 新版教程

Angular 4.x 快速入門

  • Angular 4 快速入門api

    • 涉及 Angular 簡介、環境搭建、插件表達式、自定義組件、表單模塊、Http 模塊等

  • Angular 4 基礎教程跨域

    • 涉及 Angular CLI 使用、建立組件、事件、自定義服務、 ngFor 指令、Input、Output 裝飾器等

  • Angular 4 指令快速入門

    • 涉及如何建立指令、定義輸入屬性、事件處理、如何獲取宿主元素屬性值、如何建立結構指令等

  • Angular 4 表單快速入門

    • 涉及如何建立表單、表單驗證、表單控件狀態、單選控件、多選控件的使用等

  • Angular 表單簡介

    • 涉及 Template-driven 表單與 Reactive 表單的特色、表單控件狀態、Reactive 表單簡介等

  • Angular 4.x 路由快速入門

    • 涉及路由簡介、如何配置路由、動態路由、子路由、路由指令及路由相關 API 等

  • TypeScript 簡介

    • 涉及 TypeScript 數據類型、複合類型、箭頭函數、可選參數、默認參數、對象解構、數組解構等

Angular 4.x 組件學習線路 (僅供參考)

對於剛從 Angular 1.x 轉到 Angular 4.x 的用戶，建議先閱讀一下 Angular 4.x vs Angular 1.x 章節 (目前還不夠完善)。下面提供的學習線路僅供參考，讀者能夠自行選讀。該學習線路基本包含 Angular 4.x 組件相關知識，若是有遺漏，歡迎你們指出。(友情提示：初學者不用完整了解每一個部分的內容，特別是設計源碼分析的部分，只需瞭解基本用法，而後多實踐哈)

Angular 4.x vs Angular 1.x

Provider

Directive(指令)

Decorator(裝飾器)

  • Angular 4.x Decorator - 1

    • 涉及裝飾器定義和分類、TypeScript 類裝飾器、屬性裝飾器、方法裝飾器、參數裝飾器等

  • Angualr 4.x Decorator - 2

    • 涉及 Angular 4.x 類裝飾器、屬性裝飾器、方法裝飾器、參數裝飾器示例

  • Angular 4.x Decorator - 3

    • 涉及 Angular 4.x Metadata 分類：annotations、design:paramtypes、propMetadata、parameters 及映射關係

  • Angular 4.x Input

    • 涉及 @Input、@Input('bindingPropertyName')、@Component() - inputs、setter & getter 、ngOnChanges 等

  • Angular 4.x Output

    • 涉及 @Output、@Output('bindingPropertyName')、@Component() - outputs、Two-Way Data Binding、[()] 語法示例、ngModel 等

  • Angular 4.x Inject Decorator

    • 涉及 @Inject 裝飾器的做用、實際應用及內部實現，並解釋了非 Type 類型的參數只能用 @Inject(Something) 的方式注入的緣由，此外還介紹了 @Injectable、Reflect API 等

  • Angular 4.x ViewChild & ViewChildren

    • 涉及 @ViewChild、@ViewChildren 裝飾器使用及 @ViewChild 裝飾器原理詳解

  • Angular 4.x ContentChild & ContentChildren

    • 涉及 @ContentChild、@ContentChildren 裝飾器使用及 @ContentChild 接口及裝飾器，同時介紹了 Content Projection (內容投影) 的概念及 @ContentChild 與 @ViewChild 裝飾器的區別等

  • Angular 4.x HostListener & HostBinding

    • 涉及 Host Element、HostListener 裝飾器定義及應用、Host Event Listener、HostBinding 裝飾器定義及應用、Host Property Bindings 等

Pipe(管道)

  • Angular 4.x Pipe

    • Angular 4.x 內建管道分類及使用示例、管道參數、管道鏈、自定義管道、管道分類、管道探祕等

  • Angular 4.x AsyncPipe

    • 涉及 AsyncPipe with Promise、AsyncPipe with Observables、使用 AsyncPipe 重複發送請求的解決方案及 AsyncPipe 內部執行流程 (源碼解析)

Dependency Injection(依賴注入)

Change Detection(變化檢測)

  • Angular 4.x Change Detection - 1

    • 涉及變化和變化觸發源、Zones、NgZone 及如何訪問 Zone 打補丁前的方法，如 setTimeout、clearTimeout 等

  • Angular 4.x Change Detection - 2

    • 涉及組件和變化檢測器、OnChanges、變化檢測性能優化、OnPush 策略、Mutable & Immutable、ChangeDetectorRef、Observables 等

Http

  • Angular 4.x Http Module - HTTP

    • 涉及 B/S、URI、MIME、HTTP請求和響應報文、HTTP 請求方法和狀態碼，並收錄了 HTTP 經典教程和相關工具，如 Cookie 與 Session、HTTP 緩存、CORS、HTTP/二、HTTPS及經常使用的HTTP抓包工具、Chrome相關插件、各平臺HTTP包、壓力測試工具等

  • Angular 4.x Http Module - XMLHttpRequest

    • 涉及 AJAX、XMLHTTP、XMLHttpRequest詳解、XMLHttpRequest Level 一、Level 2 詳解、XHR 上傳、下載數據、XHR 流式傳輸、XHR 定時輪詢和長輪詢區別與優缺點、XMLHttpRequest 經常使用代碼片斷、常見問題等
  • Angular 4.x HttpModule 腦圖(思惟導圖)

  • Angular 4.x HttpModule Reveal(源碼揭祕)

    • 涉及 HTTP 協議、HTTP 請求報文、HTTP 響應報文、HttpModule Request、Response、RequestOptions、ResponseOptions、XHRBackend 對象等

  • 使用 RxJS 處理多個 Http 請求

    • 涉及使用 RxJS mergeMap 和 forkJoin 操做符處理多個 Http 請求

  • 激動人心的 Angular HttpClient

    • 涉及 Angular 4.3 版本中 HttpClient 的主要特性，如默認 JOSN 解析、支持攔截器和進度事件等

  • Angular HTTP Client 快速入門

    • 涉及 Angular 4.3 版本中 HttpClient 的使用示例，如發送 Get 請求、設置查詢參數、設置請求頭、發送其它 Http 請求、並行發送多個請求、順序發送 Http 請求、異常處理、攔截器和進度事件等

Form(表單)

Router

Events

Compiler(編譯器)

  • Angular 4.x JIT vs AOT

    • 涉及 Just-In-Time & Ahead-Of-Time、JIT vs AOT 、AOT 詳解、AOT 實戰等
  • Angular 4.x Compiler (未完成)

Reference Object(引用對象)

RxJS

  • Functional Programming

    • 涉及函數式編程概念、基礎條件、重要特性、優點、經常使用方法等

  • Observable

    • 涉及觀察者、迭代器模式、Observable提案、自定義Observable、Create Operators、Observer、Pull vs Push、Observable vs Promise 等

  • Operators

    • 涉及 Marble diagrams、Create Operators、Transformation Operators、Filtering Operators、Combination Operators、Utility Operators 等

  • Subject

    • 涉及觀察者模式定義、結構及實戰、Observable subscribe、自定義 Subject、RxJS Subject、Angular 4.x RxJS Subject 應用、BehaviorSubject、ReplaySubject、AsyncSubject 等

  • RxJS - Observables, observers 和 operators 簡介

    • 涉及自定義 Observable、Operators 的相關知識

  • 自定義 toJSON 操做符

    • 涉及 RxJS 中自定義操做符的相關知識

Others(其餘)

PWA

Node.js

深刻學習 Node.js

Sequelize 系列教程

TypeScript Design Patterns

Creational（建立型模式）

Structural Patterns（結構型模式）

Behavioral Patterns（行爲型模式）

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程