許多 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 還沒完...
昨天我們介紹了使用 *ngComponentOutlet 的方法來動態產生元件，其實它是一個使用 ViewContainerRef 來顯示不同內容的行為，因此我...
基本說明 pipe 基本上就是值的轉換 下圖是在官網查詢 pipe 的所有項目https://angular.io/api?type=pipe Curre...
馬達
‧
2018-10-31
回顧一下我們目前完成的效果： 完成了新增待辦事項的功能之後，接下來當然是要來能夠註記是否已完成該項待辦事項囉！如果你有操作的話其實會發現，目前清單前面的 Ch...
先備知識 EventEmitter(中文：事件發射器)發射一個同步或非同步的自訂事件在 directives 和 components ，並註冊處理這些事件，...
馬達
‧
2018-10-30
Emacs 對於 typescript 的設定 其實在前面寫 javascript 設定時，已經將後端 tsserver 設定完畢了，這裡只要加入 (add-h...
洋蔥
‧
2018-10-30
docker run --name miaoli -v $PWD:/var/miaoli -it -d -p 4200:4200 ubuntu docker...
在設計 Angular 程式時，我們很習慣的會將各種不同目標或功能的畫面拆成不同的元件，這麼一來每個元件的程式就會相對比較簡單，管理上也會更加容易，不過當樣板上...
get node and npm basically To get this version, you can use the apt package mana...
Mike Huang
Leo
iThome鐵人賽
看影片追技術