詳細資訊
圖像 Angular 開發入門:打造高靈活度的網頁應用程式(iT邦幫忙鐵人賽系列書) ISBN13:9789864349821 出版社:博碩文化 作者:黃俊壹 (阿壹) 裝訂/頁數:平裝/304頁 規格:23cm*17cm*1.9cm (高/寬/厚) 版次:1 出版日:2022/01/19 中國圖書分類:電腦程式設計 內容簡介 本書內容改編自第 12 屆 iT 邦幫忙鐵人賽 Modern Web 組佳作網路系列文章 《Angular 全集中筆記》 Angular 是 Google 所發展出來的完整前端框架,可以用來開發網頁、桌面與行動等各種應用程式;也提供了 Angular CLI 來簡化開發過程中事務型的作業。 本書以循序漸進的方式,一層一層地由淺入深的介紹 Angular 前端框架,並搭配著圖像說明與實務案例,讓讀者更容易了解如何利用 Angular 開發高靈活性的應用程式。 目標讀者 1. 對前端框架有興趣的初學者。 2. 想要完整了解 Angular 前端框架的前端工程師。 3. 想轉職前端工程師的大大們。 本書特色 從零開始介紹 Angular 的基礎知識、各種類型的元件、依賴注入等核心內容,幫助讀者快速入門。 利用圖像化方式說明 Angular 各種觀念,幫助讀者更容易地了解在多種不同程式或元件間的抽象互動。 透過變動的需求範例程式,從簡入深的使用 Angular 各種概念,帶領讀者更容易地連結前端技術與使用者需求。 完整介紹 Angular CLI 各種命令,讓讀者熟悉在開發過程中,利用 CLI 命令簡化事務型的作業。 專業推薦 目前世面上講授 Angular 的中文書籍很少,但這本「圖像 Angular 開發入門」非常適合新手入門,對於想要進入前端框架領域的新手來說,是個相當不錯的選擇。書中講解不少 Angular 實戰開發中必須瞭解的重要觀念,搭配著完整的範例程式碼,初學者可以直接從線上就能體驗 Angular 的開發過程,也可以透過互動的方式快速掌握精髓之處。 多奇數位創意 技術總監、Google Developer Expert、Microsoft MVP ———————————————Will 保哥 | 2021/8/16 部落格:blog.miniasp.com/ 臉書專頁:www.facebook.com/will.fans/ 目錄 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 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 利用 避免改變頁面結構 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 建立服務 ...