0人評分過此書
圖像 Angular 開發入門：打造高靈活度的網頁應用程式
本書內容改編自第12屆iT邦幫忙鐵人賽Modern Web組佳作網路系列文章《Angular全集中筆記》
Angular是Google所發展出來的完整前端框架，可以用來開發網頁、桌面與行動等各種應用程式；也提供了Angular CLI來簡化開發過程中事務型的作業。
本書以循序漸進的方式，一層一層地由淺入深的介紹Angular前端框架，並搭配著圖像說明與實務案例，讓讀者更容易了解如何利用Angular開發高靈活性的應用程式。
【書籍特色】
從零開始介紹Angular的基礎知識、各種類型的元件、依賴注入等核心內容，幫助讀者快速入門。
利用圖像化方式說明Angular各種觀念，幫助讀者更容易地了解在多種不同程式或元件間的抽象互動。
透過變動的需求範例程式，從簡入深的使用Angular各種概念，帶領讀者更容易地連結前端技術與使用者需求。
完整介紹Angular CLI各種命令，讓讀者熟悉在開發過程中，利用CLI命令簡化事務型的作業。
【目標讀者】
1. 對前端框架有興趣的初學者。
2. 想要完整了解Angular前端框架的前端工程師。
3. 想轉職前端工程師的大大們。
【專業推薦】
目前世面上講授Angular的中文書籍很少，但這本「圖像Angular開發入門」非常適合新手入門，對於想要進入前端框架領域的新手來說，是個相當不錯的選擇。書中講解不少Angular實戰開發中必須瞭解的重要觀念，搭配著完整的範例程式碼，初學者可以直接從線上就能體驗Angular的開發過程，也可以透過互動的方式快速掌握精髓之處。
多奇數位創意技術總監、Google Developer Expert、Microsoft MVP
──Will 保哥 | 2021/8/16
Angular是Google所發展出來的完整前端框架，可以用來開發網頁、桌面與行動等各種應用程式；也提供了Angular CLI來簡化開發過程中事務型的作業。
本書以循序漸進的方式，一層一層地由淺入深的介紹Angular前端框架，並搭配著圖像說明與實務案例，讓讀者更容易了解如何利用Angular開發高靈活性的應用程式。
【書籍特色】
從零開始介紹Angular的基礎知識、各種類型的元件、依賴注入等核心內容，幫助讀者快速入門。
利用圖像化方式說明Angular各種觀念，幫助讀者更容易地了解在多種不同程式或元件間的抽象互動。
透過變動的需求範例程式，從簡入深的使用Angular各種概念，帶領讀者更容易地連結前端技術與使用者需求。
完整介紹Angular CLI各種命令，讓讀者熟悉在開發過程中，利用CLI命令簡化事務型的作業。
【目標讀者】
1. 對前端框架有興趣的初學者。
2. 想要完整了解Angular前端框架的前端工程師。
3. 想轉職前端工程師的大大們。
【專業推薦】
目前世面上講授Angular的中文書籍很少，但這本「圖像Angular開發入門」非常適合新手入門，對於想要進入前端框架領域的新手來說，是個相當不錯的選擇。書中講解不少Angular實戰開發中必須瞭解的重要觀念，搭配著完整的範例程式碼，初學者可以直接從線上就能體驗Angular的開發過程，也可以透過互動的方式快速掌握精髓之處。
多奇數位創意技術總監、Google Developer Expert、Microsoft MVP
──Will 保哥 | 2021/8/16
-
01 進入 Angular 世界的大門
-
1.1 Angular 簡介
-
1.1.1 Angular 的發展歷史
-
1.1.2 Angular 特性
-
-
1.2 建置 Angular 開發環境
-
1.2.1 安裝 Node.js
-
1.2.2 安裝 Angular CLI
-
1.2.3 利用 Angular CLI 建立專案
-
1.2.4 啟動 Angular 應用程式
-
-
-
02 專案結構與模組（Module）
-
2.1 Angular 專案檔案結構
-
2.1.1 開發相依套件檔案
-
2.1.2 Angular 專案定義檔
-
2.1.3 TypeScript 組態設定檔
-
2.1.4 Angular 應用程式檔案
-
2.1.5 環境設定檔
-
-
2.2 Angular 模組
-
2.2.1 什麼是 Angular 模組
-
2.2.2 @NgModule 裝飾器的定義
-
2.2.3 BrowserModule 與 CommonModule
-
-
-
03 應用程式的基石– 元件（Component）
-
3.1 元件的概述
-
3.1.1 什麼是 Angular 元件
-
3.1.2 利用 Angular CLI 建立元件
-
3.1.3 @Component 裝飾器的定義
-
-
3.2 單向繫結（One-way binding）
-
3.2.1 文字插值（Text interpolation）
-
3.2.2 事件繫結（Event Binding）
-
3.2.3 屬性繫結（Property / Attribute Binding）
-
3.2.4 樣式繫結（Style Binding）
-
3.2.5 類別繫結（Class Binding）
-
-
3.3 巢狀元件間的互動
-
3.3.1 利用 @Input 裝飾器接收父元件資料
-
3.3.2 利用 @Attribute 裝飾器接收父元件資料
-
3.3.3 利用 @Output 裝飾器通知父元件
-
3.3.4 雙向繫結（Two-way Binding）
-
3.3.5 利用範本參考變數使用子元件屬性與方法
-
-
3.4 頁面範本的封裝
-
3.4.1 封裝頁面範本
-
3.4.2 動態內容投影
-
-
3.5 生命週期
-
3.5.1 輸入屬性值變更監控
-
3.5.2 元件初始化作業
-
3.5.3 自訂變更檢測
-
3.5.4 動態內容投影的初始與變更檢測
-
3.5.5 頁面檢視的初始與變更檢測
-
3.5.6 元件實體銷毀
-
-
3.6 元件樣式
-
3.6.1 檢視封裝模式（View encapsulation model）
-
3.6.2 特殊的選擇器
-
-
-
04 功能擴增的黑魔法 – 指令（Directive）
-
4.1 指令的概述
-
4.1.1 什麼是 Angular 指令
-
4.1.2 利用 Angular CLI 建立指令
-
4.1.3 @Directive 裝飾器的定義
-
-
4.2 Angular 內建指令
-
4.2.1 清單列表 – ngFor
-
4.2.2 條件判斷 – ngIf
-
4.2.3 多個條件判斷 – ngSwitch
-
4.2.4 動態元件載入 – ngComponentOutlet
-
4.2.5 利用 ＜ng-container＞ 避免改變頁面結構
-
4.2.6 利用 @ViewChild 取得含結構型指令的元素
-
-
4.3 自訂 Angular 指令
-
4.3.1 自訂變更元素樣式的屬性型指令（Attribute Directive）
-
4.3.2 自訂改變元素行為的屬性型指令（Attribute Directive）
-
4.3.3 自訂結構型指令（Structural Directive）
-
-
4.4 自訂指令內的繫結
-
4.4.1 @HostListener 裝飾器
-
4.4.2 @HostBinding 裝飾器
-
-
-
05 檢視資料的面具 – 管道（Pipe）
-
5.1 Angular 內建管道
-
5.1.1 檢視物件資料 – JsonPipe
-
5.1.2 改變字母大小寫 – TitleCasePipe / LowerCasePipe / UpperCasePipe
-
5.1.3 限制顯示長度 – SlicePipe
-
5.1.4 物件轉換成陣列 – KeyValuePipe
-
5.1.5 數值資料的顯示 – DecimalPipe
-
5.1.6 百分比資料的顯示 – PercentPipe
-
5.1.7 貨幣資料的顯示 – CurrencyPipe
-
5.1.8 日期資料的顯示 – DatePipe
-
-
5.2 自訂 Angular 管道
-
5.2.1 利用 Angular CLI 建立管道
-
5.2.2 利用管道將陣列資料倒序排列
-
-
-
06 應用程式的橋梁 – 服務（Service）
-
6.1 自訂 Angular 服務
-
6.1.1 利用 Angular CLI 建立服務
-
6.1.2 利用 @Injectable 裝飾器配置可注入的服務
-
6.1.3 獨體設計模式（Singleton）的服務實體
-
6.1.4 水平元件間的互動
-
-
6.2 利用提供者設定抽換服務
-
6.2.1 利用 useClass 抽象服務
-
6.2.2 利用 useExisting 抽象服務
-
6.2.3 利用 useValue 抽象服務
-
6.2.4 利用 useFactory 抽象服務
-
6.2.5 提供者範圍
-
-
6.3 自訂提供者令牌
-
6.3.1 類別類型的令牌
-
6.3.2 字串類型的令牌
-
6.3.3 InjectionToken 令牌
-
6.3.4 相同令牌指定多種提供者
-
-
6.4 遠端資料的取得
-
6.4.1 利用 HttpClient 取得遠端資料
-
6.4.2 利用 AsyncPipe 管道顯示可監控的資料
-
6.4.3 利用 HttpClient 把資料傳到後端服務
-
6.4.4 利用 HTTP_INTERCEPTORS 攔截請求
-
-
6.5 Angular 內建注入裝飾器
-
6.5.1 選擇性的注入 – @Optional()
-
6.5.2 改變注入的起訖位置 – @Self() / @SkipSelf() / @Host
-
-
-
07 範本驅動表單（Template-Driven Form）
-
7.1 利用範本驅動表單建立表單
-
7.1.1 範本驅動表單概述
-
7.1.2 利用 NgModel 指令定義表單模型屬性
-
7.1.3 利用範本參考變數取得表單模型屬性值
-
7.1.4 取得 NgForm 型別的表單模型
-
7.1.5 利用 NgModelGroup 指令定義表單群組
-
-
7.2 表單狀態的使用
-
7.2.1 表單輸入項是否已被點選
-
7.2.2 表單輸入項是否曾經輸入過
-
7.2.3 表單輸入項是否驗證通過
-
7.2.4 表單輸入項是否為可輸入狀態
-
7.2.5 表單是否提交過
-
-
7.3 表單的欄位驗證
-
7.3.1 設定必填的欄位驗證
-
7.3.2 設定欄位最小與最大長度驗證
-
7.3.3 設定 Email 格式驗證
-
7.3.4 數值欄位範圍驗證
-
7.3.5 設定正規化表示式驗證
-
7.3.6 自訂表單驗證指令
-
-
-
08 響應式表單（Reactive Form）
-
8.1 利用響應式表單建立表單
-
8.1.1 響應式表單概述
-
8.1.2 利用 FormControl 建立單一欄位的表單
-
8.1.3 利用 FormGroup 建立表單群組
-
8.1.4 利用 FormArray 建立表單陣列
-
8.1.5 利用 FormBuilder 建立表單
-
-
8.2 表單的欄位驗證
-
8.2.1 設定表單欄位驗證
-
8.2.2 自訂欄位同步驗證方法
-
8.2.3 自訂欄位非同步驗證方法
-
-
8.3 表單模型常用方法
-
8.3.1 表單值的存取與監控
-
8.3.2 表單陣列結構的操作
-
8.3.3 表單狀態的設定與監控
-
8.3.4 表單驗證的設定
-
-
8.4 自訂表單元件
-
8.4.1 實作 ControlValueAccessor 介面
-
8.4.2 設定 NG_VALUE_ACCESSOR 令牌提供者
-
8.4.3 實作 Validator 介面
-
8.4.4 設定 NG_VALIDATORS 令牌提供者
-
-
-
09 功能頁面的切換 – 路由（Router）
-
9.1 利用路由切換頁面
-
9.1.1 應用程式的路由模組
-
9.1.2 基本路由定義
-
9.1.3 轉址路由定義
-
9.1.4 萬用路由（wildcard route）定義
-
9.1.5 利用 routerLink 指令切換路由頁面
-
9.1.6 利用 Router 服務方法切換路由頁面
-
-
9.2 路由的參數與資料傳遞
-
9.2.1 路由參數的傳遞與取得
-
9.2.2 查詢字串的傳遞與取得
-
9.2.3 路由資料的傳遞與取得
-
-
9.3 子路由與延遲載入（Lazy Loading）
-
9.3.1 子路由的設定
-
9.3.2 延遲載入的設定
-
-
9.4 路由守門員（Router Guard）
-
9.4.1 利用 Angular CLI 建立路由守門員
-
9.4.2 檢查是否有權限進入頁面
-
9.4.3 檢查是否可以離開頁面
-
-
9.5 其他路由設定
-
9.5.1 Angular 內建路由策略
-
9.5.2 追蹤與訂閱路由事件
-
9.5.3 強制重新整理頁面
-
-
-
10 開發、建置與部署
-
10.1 Angular CLI 常用指令
-
10.1.1 建立函式庫專案
-
10.1.2 利用 Schematics 管理套件與建立元件
-
10.1.3 執行單元測試
-
10.1.4 程式碼風格檢查
-
-
10.2 應用程式的建置組態
-
10.2.1 工作空間組態
-
10.2.2 靜態檔案的設定
-
10.2.3 全域樣式與 JavaScript 檔案配置
-
10.2.4 不同執行環境變數的配置
-
-
10.3 部署應用程式
-
10.3.1 利用 ng build 命令建置應用程式
-
10.3.2 IIS 站別設定
-
-
- 出版地 ： 臺灣
- 語言 ： 繁體中文
評分與評論
請登入後再留言與評分
PDF
PDF
PDF
PDF
PDF
