昨天我們把落單的 UI 元件跟其模組關聯完之後，今天接著要來設定路由的部份！ 開始設定路由前，可以先看看我們準備好的路徑定義檔 － app-path.const...
在撰寫前端程式時，我們很難避免會遇到非同步的程式處理，在大量使用 RxJS 的 Angular 中更是如此，而今天我們要介紹的 AsyncPipe 在樣板上要處...
這次小學堂要跟大家一起練習的是一個簡單的 EC 網站。 素材是來自剛好在鐵人賽前夕時，由六角學院在 The F2E - 前端修練精神時光屋 舉辦的 【網頁排版P...
子路由模組 當我們將頁面或功能包裝成模組的時候，也能在其中加入路由的設定，使其變成含有路由的子路由模組。 跟 AppRoutingModule 不一樣的是，子路...
今天我們來看看元件內的變更偵測策略，打造高效能元件！ 類型：觀念 難度：5 顆星 實用度：4 顆星 關於元件內的變更偵測 首先來看一下這段程式碼： impor...
我覺得路由是 Angular 裡很重要的一部分，也是一個初學者比較不容易理解的部分，所以希望透過這七天的小小練習，會讓大家對路由有個初步的認識。 不過分了七天講...
昨天我們講到了 Angular 使用 NgZone 來決定變更偵測的時機，今天我們來認識一下 Angular 提供的另外一個比較常用來決定變更偵測時機的工具 -...
在 module 匯入 HttpClientModule app.module.ts ------ import { HttpClientModule } fr...
馬達
‧
2018-11-09
許多 Angular 開發人員對於 NgZone 這個詞應該都不太陌生，尤其是在早期 Angular 剛推出時，只要發生錯誤，就會在 F12 開發人員工具看到一...
相信大家都用使用過 Facebook 吧？ 當我們想在 Facebook 發文或留言的時候，如果不小心按到上一頁/下一頁，抑或是沒有取消發文或留言的狀態就想離開...
HttpClient 啟用 app.module.ts ----- import { HttpClient, HttpHeaders } from '@angu...
馬達
‧
2018-11-08
title: "[Angular 大師之路] 認識 InjectionToken"date: 2018-11-07 22:24:16cat...
繼延遲載入之後，今天要分享的也是個非常實用的功能－路由守門員。 大家應該都知道守門員吧？如果不知道的話...警衛總知道了吧？！ 顧名思義，這個功能可以幫我們把關...
前兩天我們學到了多種替換注入 token 內容的方法，今天我們來看看如何取得不同注入內容的方式： 類型：觀念 難度：4 顆星 實用度：3 顆星 建構式注入 建構...
Angular 是一個很注重模組化開發的框架 還記得我在 基礎結構說明（一） 有提到過這句話嗎？ 我一直覺得這句話是在使用 Angular 開發時，很重要的...
對RxJS的想法 RxJS基本是「有流程處理資料的方法集合」，從包裝到加工最後輸出，對於 Angular 來說是必備的(像 HttpClient 也會用到)，原...
馬達
‧
2018-11-05
相依注入是一般物件導向程式設計的一個大重點，相依注入用得越好程式彈性就越高，而 Angular 本身架構就包含了非常強大的相依注入功能，讓我們自由切換想要注入的...
到目前為止，我們都是只有用 Component 來設定我們的路由。但在實際應用上，通常我們會將相關的功能包裝成一個一個的 NgModule ，而每個 NgMod...
「原來 Angular 的路由是這樣設定的，比我想像中簡單耶！」Wayne 做完練習之後正玩得不亦樂乎。 「是滿簡單的，不過目前只有第一層而已。在實務上應用時一...
在開發一個應用程式時，我們常常需要在程式正常運作前，進行一些初始化的動作，在 Angular 中則是提供了一個 APP_INITIALIZER 設定，讓我們可以...
昨天我們完成了上圖的路由設定與換頁效果，所以 Angular 的路由機制到底做了什麼呢？ 還記得我們昨天有在 app-routing.module.ts 做了...
今天我們來看看，如何集中管理所有的錯誤訊息。 類型：技巧 難度：3 顆星 實用度：3 顆星 在撰寫程式時，我們很難避免完全不發生任何錯誤，總是會有未預期錯誤發...
先說說有路由守衛 當需要路由守衛，用於判別可否進入該路由，關鍵字：canActivate，下面都是好文章，快去爬文吧！ㄜ~先把下面的看完再走！https://a...
馬達
‧
2018-11-02
「Leo，我一直有個問題想問你。」Wayne 神秘兮兮的說。 「什麼問題？」看他這麼神秘兮兮的我也緊張了起來。 「既然是 SPA ，就代表整個 Web 從頭到尾...
在開發 Angular 應用程式時，HTTP 請求絕對可以說是最常使用的功能之一，而在一般的應用情境上，我們很常會需要針對請求再做額外的包裝，或統一的管理，這時...
「Yes！終於完成了！！」Wayne 做完 Todo List 之後開心地舉起雙手大聲歡呼。 「如何？寫 Angular 很好玩吧？！」我笑著說。 「好玩好玩！...
先備知識 路由用在哪裡？根據網址替換頁面，換 component router-outlet ，會讓 路由分配並顯示 component 內容 部屬 路由需要的...
馬達
‧
2018-11-01
今天久違的把我最喜歡的設計師的圖刻完，關於頁面 遇到一個很久沒碰到的問題（因為最近大量使用flex去排版XD），行內塊級的間距，會因元素HTML標籤間的空白、換...
前幾天我們花了不少時間在介紹 *ngComponentOutlet 以及 *ngTemplateOutlet ，這種會改變 DOM 結構的語法，像是 *ngIf...
上圖是我們目前的進度，已完成了待辦事項的新增、刪除與狀態變更的功能。 CRUD （Create、Read、Update、Delete） 目前只剩下 U 還沒完...
Leo
Mike Huang
iThome鐵人賽
看影片追技術