LUMIFY WORK Angular 12 編程

為什麼要學習本課程

這門綜合性 Angular 12 程式設計課程結合了理論學習和實踐實驗室，包括 Angular 簡介，然後是 TypeScript、元件、指令、服務、HTTP 用戶端、測試和調試。
該課程充滿了有用且可操作的信息，您可以立即將其應用到您的工作中。學習基本 Angular 12 開發的基礎知識，例如單頁瀏覽器應用程式、響應式應用程式 web網站和混合行動應用程式。
筆記：我們也可以提供其他版本 Angular 的培訓。請聯絡我們進行詢問或登記您的興趣。

你會學到什麼
成功完成本課程後，您將能夠：

• 使用 Typescript 開發單頁 Angular 應用程式
• 建構完整的Angular開發環境
• 建立元件、指令、服務、管道、表單和自訂驗證器
• 使用 Observables 處理高階網路資料擷取任務 使用來自 REST 的數據 web 使用 Angular HT TP 用戶端的服務 使用 Web套接字協議
• 使用 Angular Pipes 格式化數據
• 使用高級 Angular 組件路由器功能
• 使用內建工具測試和調試 Angular 應用程式。

課程科目

第 1 章 Angular 簡介

• 什麼是角？
• Angular 框架的核心特徵適當的用例
• Angular 應用程式的構建塊 Angular 應用程式的基本架構 安裝和使用 Angular
• Angular 應用程式剖析 運行應用程式
• 為本機行動應用程式建置和部署應用程式 Angular
• 概括

第 2 章 TypeScript 簡介

• 用於 Angular TypeScript 語法的程式語言
• 節目編輯
• 類型系統－定義變數
• 類型系統 – 定義數組
• 基本基元類型
• 輸入函數
• 類型推斷
• 定義類別
• 類別方法
• 能見度控制
• 類別建構函數
• 類別建構子 - 替代形式未初始化字段
• 介面
• 使用 ES6 模組
• var 與 let
• 箭頭函數
• 箭頭函數緊湊語法模板字串
• 類別中的泛型
• 函數中的泛型
• 概括

第 3 章組件

• 什麼是組件？
• 一個前amp組件
• 使用 Angular CLI 建立元件
• 組件類別
• @Component 裝飾器
• 將組件註冊到其模組組件模板
• Example：HelloComponent 模板
• Example：使用元件的 HelloComponent 類
• 運行應用程序
• 組件層次結構
• 應用程式根元件
• 引導程式 File
• 組件生命週期鉤子 Examp生命週期鉤子
• CSS 樣式
• 概括

第 4 章組件模板

• 範本
• 模板位置
• 小鬍子 {{ }} 語法
• 設定 DOM 元素屬性
• 設定元素正文
• 事件綁定
• 表達式事件處理程序
• 防止預設處理
• 屬性指令
• 透過更改 CSS 類應用程式樣式
• Example: ngClass
• 直接套用樣式
• 結構指令
• 有條件執行模板
• Examp文件：ngIf
• 使用 ngFor 循環
• ngFor 局部變數
• 操縱集合Example – 刪除項目
• 使用 ngFor 進行專案追蹤 使用 ngSwitch 分組元素交換元素
• 模板參考變數摘要

第 5 章組件間通信

• 溝通基礎知識
• 資料流架構
• 讓孩子做好接收資料的準備
• 從父級發送數據
• 關於設定屬性的更多信息
• 從組件觸發事件
• @Output() 前ample – 子元件 @Output() Example – 父元件
• 全雙向綁定
• 在父級中設定雙向資料綁定
• 概括

第 6 章範本驅動表單

• 範本驅動表單
• 導入表單模組
• 基本方法
• 設定表單
• 取得用戶輸入
• 省略 ngForm 屬性
• 初始化表單
• 雙向資料綁定
• 表格驗證
• 角度驗證器
• 使用類別附加輸入類型顯示驗證狀態
• 複選框
• 選擇（下拉）字段
• 選擇（下拉）日期欄位的呈現選項
• 單選按鈕
• 概括

第 7 章反應式形式

• 反應式形式結束view
• 建構模組
• 導入ReactiveForms模組
• 建構表單
• 設計模板
• 取得輸入值
• 初始化輸入字段
• 設定表單值
• 訂閱輸入更改
• 驗證
• 內建驗證器
• 顯示驗證錯誤
• 自訂驗證器
• 使用自訂驗證器
• 向自訂驗證器提供配置
• FormArray – 動態新增輸入
• FormArray – 元件類
• FormArray – 模板
• FormArray – 值
• 子表單組 – 元件類
• 子表單組 – HTML 模板
• 為什麼要使用子表單群組
• 概括

第 8 章服務與依賴注入

• 什麼是服務？
• 建立基本服務
• 服務等級
• 什麼是依賴注入？
• 注入服務實例
• 噴油器
• 噴油嘴層次結構
• 使用根注入器註冊服務
• 使用組件的注入器註冊服務
• 使用功能模組注入器註冊服務
• 在哪裡註冊服務？
• 其他工件中的依賴注入提供替代實現依賴注入和@Host
• 依賴注入和@Optional
• 概括

第 9 章 HTTP 用戶端

• Angular HT TP 用戶端
• 使用 HTTP 用戶端 – 結束view
• 導入 HttpClient 模組
• 使用 HttpClient 的服務
• 發出 GET 請求
• 可觀察對像有什麼作用？
• 在組件中使用服務
• PeopleService 用戶端元件錯誤處理
• 自訂錯誤對象
• 發出 POST 請求
• 發出 PUT 請求
• 發出刪除請求

第 10 章管道和資料格式化

• 什麼是管道？
• 內建管道
• 在 HTML 範本中使用管道
• 國際化管道 (i18n) 載入區域設定數據
• 日期管
• 管數
• 貨幣管
• 建立自訂管道
• 定制管道防爆ample
• 使用自訂管道
• 將管道與 ngFor 一起使用
• 過濾管
• 管材類別：純管和非純管
• 概括
• 純管防爆ample
• 不純管道防爆ample
• 概括

第 11 章單頁應用程式簡介

• 什麼是傳統單頁應用程式 (SPA) Web 應用
• SPA工作流程
• 單頁應用程式高級版tages HTML5 歷史 API
• 水療挑戰
• 使用 Angular 實作 SPA 摘要

第 12 章 Angular 元件路由器

• 元件路由器
• View 導航
• Angular 路由器 API
• 建立支援路由器的應用程式
• 託管路由元件
• 使用連結和按鈕導航
• 程式化導航
• 傳遞路由參數
• 使用路線參數導航
• 取得路由參數值
• 同步取得路由參數
• 非同步檢索路由參數
• 查詢參數
• 提供查詢參數
• 非同步檢索查詢參數
• 手冊問題 URL 條目和書籤
• 概括

第 13 章 進階 HTTP 用戶端

• 請求選項
• 返回 HttpResponse 對象
• 設定請求標頭
• 創建新的可觀察量
• 創建一個簡單的可觀察對象
• Observable 建構子方法 Observable 運算符
• 地圖和過濾器 運營商
• flatMap() 運算符
• tap() 運算符
• zip() 組合器
• 快取 HT TP 回應
• 進行連續的 HT TP 調用
• 進行並行調用
• 使用 catchError() 自訂錯誤對象
• 管道錯誤
• 錯誤恢復
• 概括

第 14 章 Angular 模組

• 為什麼選擇 Angular 模組？
• 模組類剖析
• @NgModule屬性
• 功能模組
• Examp文件模組結構
• 建立域模組
• 建立路由/路由模組對
• 建立服務模組
• 建立通用模組

第 15 章高階路由

• 路由啟用功能模組
• 使用功能模組
• 延遲載入功能模組
• 為功能模組組件建立連結
• 關於延遲加載的更多信息
• 預先載入模組
• 預設路由
• 通配符路由路徑
• 重新導向至
• 子路線
• 定義子路由
• 對於子路線
• 子路線的連結
• 導航衛士
• 創建 Guard 實現
• 在路線中使用守衛
• 概括

第 16 章 Angular 應用程式的單元測試

• 單元測試角度工件
• 測試工具
• 典型測試步驟
• 測試結果
• 茉莉花測試套件
• Jasmine 規格（單元測試）
• 期望（斷言）
• 匹配器
• Examp使用匹配器的文件
• 使用 not 屬性
• 單元測試套件中的設定和拆卸
• ExampbeforeEach 和 afterEach 函數的文件
• 角度測試模組
• Examp角度測試模組
• 測試服務
• 注入服務實例
• 測試同步方法
• 測試非同步方法
• 使用模擬 HT TP 用戶端
• 提供預設回复
• 測試組件
• 元件測試模組
• 建立組件實例
• ComponentFixture 類
• 基本組件測試
• 調試元素類
• 模擬使用者交互
• 概括

第 17 章調試

• 超過view 角度調試
• View在調試器中使用 TypeScript 程式碼
• 使用偵錯器關鍵字
• 調試日誌
• 什麼是 Angular 開發工具？
• 使用 Angular 開發工具
• Angular DevTools – 元件結構
• Angular DevTools – 變更偵測執行
• 捕捉語法錯誤
• 概括

實驗室練習

• 實驗 1. Angular 簡介
• 實驗 2. TypeScript 簡介
• 實驗 3. 組件簡介
• 實驗 4. 組件模板
• 實驗 5. 建立照片庫元件
• 實驗 6. 範本驅動表單
• 實驗 7. 建立編輯表單
• 實驗 8. 反應形式
• 實驗 9. 開發服務
• 實驗 10. 開發 HT TP 用戶端
• 實驗 11. 使用管道
• 實驗 12. 使用 Router 的基本單頁應用程式 實驗 13. 建立單頁應用程式 (SPA)
• 實驗 14. 進階 HT TP 用戶端
• 實驗 15. 使用 Angular Bootstrap
• 實驗 16. 延遲模組加載
• 實驗 17. 進階路由
• 實驗室 18. 單元測試
• 實驗 19. 調試 Angular 應用程式

該課程適合誰？
本課程面向任何需要學習 Angular 12 開發基礎知識並將其應用於創建的人 web 立即申請。我們還可以為更大的團體提供和客製化此培訓課程 - 節省您的組織的時間、金錢和資源。

必備條件
Web 要充分利用本 Angular 課程，需要具備使用 HTML、CSS 和 JavaScript 的開發經驗。了解瀏覽器 DOM 也很有用。不需要具備 AngularJS 或任何版本的 Angular 經驗。
https://www.lumifywork.com/en-au/courses/angular-12-programming/

文件/資源

LUMIFY WORK Angular 12 編程 [pdf] 使用者指南 Angular 12 編程、Angular、12 編程、編程

參考

• 使用者手冊