上一篇設定好路由模組的設定，這一篇要實際應用設定好的路由模組，來實際切換頁面，顯示英雄的資料。 資料一覽 目前英雄列表的資料格式為: { "sta...
練習目標 今天的練習非常簡單，我們要利用 ng update 來改變 app.component.ts 裡， title 屬性的值。 雖然這個練習非常地陽春、簡...
隨著自己開發的 Angular 專案越來越多，有時候難免會覺得自己好像一直在做重複的事，因此我們會開始試著將可以重複使用的模組拆成獨立的函式庫，就像是保哥的認識...
筆者在 Day13 的時候有跟大家分享過 ng add 的原理與運作方式，而 ng update 雖然也是走同樣的路徑，只不過筆者覺得後者在後續處理上，跟其他的...
簡述 傳統常見的導航做法多半是麵包屑breadcrumb，但是在系統組織很多分層的結構下，光要多方對帳，可能會查證的比較辛苦，所以現在越來越多採 Tab 導航模...
到目前為止，我們所做的一切內容，都是做在首頁。現在要來做更多頁面來顯示英雄的細節資料 事前準備 在開始之前，先修改一下原本的英雄資料，多一個descriptio...
相信經過昨天的原理說明之後，大家一定迫不及待地想要趕快實作了！！ 廢話不囉嗦，不管你是要新開一個 Schematics 或是用原本的專案都行，筆者會用原本的專案...
簡述 其實Menu的控制項取決於登入者的權限。 功能 以Demo來說，所有的頁面種類有以下： index 首頁 user 用戶管理 admin 權限管理 c...
Angular 中 Components 之間的傳遞資料的方式，就長得像下面這張圖。 Input() 裝飾器使用方式 @Input 的目的是確認資料綁定 in...
上一篇提到什麼是RXJS和RXJS的基本觀念，這一篇要來實際操作RXJS。 在進入實際操作之前，還要來提RXJS方便的地方-運算子(Operators) 什麼是...
今天筆者要來分享一個超好用的 VSCode 擴充套件給大家： 這個擴充套件好用在哪裡呢？ 減少因打錯字所浪費的時間。 不用再自己搜尋指令或參數，它會幫你全部...
簡述 在確認此使用者的相關資訊後會進入核心模塊，也是佈局畫面的底。很多功能模塊會以延遲子路由的方式，掛在核心模塊裡。 畫面結構 <!--core.com...
了解 Angular Debug 訊息 以上的 範例 Code 因為沒有實際執行所以 Typescript 是當下找不到錯誤的，要執行過 onAddServer...
在上一篇，使用httpClient取得API資料的時候，看到一段陌生的程式碼 ngOnInit() { // this.heros = this.da...
三十天系列文至此即將告一個段落，雖然筆者到目前為止並沒有分享非常多的實戰，但 ng generate 、 ng add 、 ng update 這三個面向的 S...
簡單講 Directives 就是 指示 DOM 如何做操作，而其操作又區分為改變屬性以及針對 DOM 做操作例如: *ngIf <p *ngIf=&qu...
在上一篇提到，所有存取資料的操作都應該在服務(Service)完成，元件(Componet)不應該負責存取資料，只應該負責如何顯示資料與畫面上的操作。 因此建立...
簡述 AppComponent 是系統內的 根組件，這篇會講述登入初始流程。 功能 開發過程中大概遇到幾種設定如下。 多語系初始設定 icon 讀取圖片 登入...
在前幾篇，一直在討論元件(component)的各種應用。元件顯示資料的各種方法，以及最後討論到元件的資料要如何輸入與輸出。元件的討論在此告一段落，這一篇要來討...
寫在前面，為什麼要寫這一篇 Angular 最主要使用 Zone.js 來解決 Angular 非同步 事件的 Error Hadnling 的問題，所以當你看...
簡述 AppComponent是系統內的 根組件，通常會建議寫部分服務的初始設定。 功能 開發過程中大概遇到幾種設定如下： 多語系初始設定 icon讀取圖片...
還記得筆者在 Day02 - 要學打人，先學挨打 有提到過關於 ng add 的應用嗎？ 雖然我們都知道 ng add 可以幫我們新增某個 Library 或...
利用 @HostListener 關閉 browser 前會先詢問 import { HostListener } from '@angular/core';...
在第二篇，為什麼選擇選擇Angular的文章提到，Angular的其中之一個優點是高度模組化，可以像樂高一樣，高度與其他元件結合與抽離。而高度模組化的訣竅在於，...
簡述 說明會有哪些常見的服務是所有組件都會用的。 功能 開發過程中有幾種服務是必然用到的。 logger.service.ts web.service.ts...
為甚麼要學習 Typescipt 為甚麼要學習 Typescipt，或是說 為什麼要用Typescipt 呢，Typescipt 又有什麼樣的優點跟有什麼基本...
＊資料夾結構＊ ― [project name] └ frontend └ web └ mobile(pwa) └ backend 會這樣命名...
簡述 說明會有哪些常見的服務是所有組件都會用的。 功能 開發過程中有幾種服務是必然用到的。 logger.service.ts web.service.ts...
在前幾邊介紹到插值法、ngFor、ngIf、ngSwitch等等方法，最主要都是顯示資料的應用。最後介紹到雙向綁定-ngModel，修改資料時會修改綁定的資料外...
簡述 說明會有哪些常見的服務是所有組件都會用的。 功能 開發過程中會有幾種服務是必然用到的。 logger.service.ts web.service.ts...
tso1158687
Leo
Yating Chang
TimTim
iThome鐵人賽
看影片追技術