貼心小語 上一篇成功透過 web3.js 來呼叫合約中的函式。我們之前設計的函式只要會變更狀態變數的操作都會記錄 log ,也就是觸發 event ,那要怎麼去...
在這個單元我們使用官網的教學搭配Angular的框架,STEP BY STEP的撰寫Component及Stories。(如果是使用Vue的讀者,可以跳過這個單...
簡述 AppComponent 是系統內的 根組件,這篇會講述登入初始流程。 功能 開發過程中大概遇到幾種設定如下。 多語系初始設定 icon 讀取圖片 登入...
本章節將要介紹如何使用 ng-content 將一個 Component 的內容投影到另一個 Component 中,創建靈活且可被重複使用的 Componen...
在上一篇中介紹了 Angular 中 Module 的一部分,接著要繼續介紹還沒講完的部分,那就往下看吧 Entry components 在上一張的 Ng...
昨天筆者提到如何使用 TypeScript Compiler API 來修改檔案,但想必大家多少應該有感覺到,如果要從那一層又一層的資料結構中找到需要用的區塊,...
前言 專案需求通常來源於對資料的處理,在專案規劃期間,前端開發人員經常需要先做一些 POC,甚至專案開始後,也經常需要在後端 API 尚未就緒前,先完成前端的功...
隨著自己開發的 Angular 專案越來越多,有時候難免會覺得自己好像一直在做重複的事,因此我們會開始試著將可以重複使用的模組拆成獨立的函式庫,就像是保哥的認識...
貼心小語 上一篇做完了 Government 與 Host 的功能頁面,還將共同功能抽離出來做成 ComponentBase ,使我們開發更順暢,所以今天來完成...
在介紹完 component 與 template 後,接著要來介紹什麼是 dierctive,可能在前面的章節中多多少少都有提到,但是可能都沒有詳細的講解過,...
經過了這段時間的練習與學習,相信大家應該越來越能體會 Angular 表單的強大與便利。 不過既然 Angular 表單這麼好用,如果能讓自己做的 Compo...
這段期間,我們用 Template Driven Forms 與 Reactive Forms 各自做了一個登入表單(靜態)與被保人表單(動態),而且我們也都...
這一篇要來介紹Typescript的實用功能 - 列舉(Enum) 什麼是列舉(Enum) 列舉可以轉換一組備有限範圍的資料,比如說日期、郵遞區號、星期等等。列...
簡述 當設計圖與規格都出現後,前後端都會開始製作底層,前端雖著重畫面呈現,開發的大部分時間也確實花在畫面上居多,為了減低變動更改程式,大多數人會等待後端給API...
練習目標 今天的練習非常簡單,我們要利用 ng update 來改變 app.component.ts 裡, title 屬性的值。 雖然這個練習非常地陽春、簡...
今天直接進入Live Coding的部分,有關影片內容可以看 前言 前幾天帶大家理順專案的流程,昨天定義好前端資料格式後,然後進入正式開發流程。 從Stac...
平常都用慣 TypeScript 版的 Cypress,但這兩天都用 JavaScript 在寫測試,令我有點不太習慣。 雖然 JS 版或 TS 版的差別並沒...
本篇延續上篇的實作 components ,用商家管理的功能來說明 Container components 與 Presentational componen...
上一篇中介紹完 Template-driven forms 後,接著再介紹 Angular 的另一種 form,那就是 Reactive forms,它提供了一...
在測試程式中模擬 Angular 專案環境 當我們開始將 Schematic 與 Angular 專案整合後,就會需要處理越來越多的細節。尤其是在測試時,會更需...
學習 Angular 的過程中,遇到了一些教學資源不見得會遇到的問題,還真是家常便飯,而且你個人電腦沒遇到,但公司派發給你的筆電偏偏就遇到了,所以就來記錄一下吧...
前言 專案開發後期會進入 QA 測試階段,其中免不了各種手動點擊切換頁面或迴歸測試等,每個功能都要人工進到畫面中看一遍有沒有問題,這樣不僅工作量大重複性高,且當...
Storybook的另一個主要的功能就是Addons 在使用Storybook做元件開發設計時搭配Addon功能更加強大 接下來就來好好體驗感受他的威力吧 寫在...
大概介紹完了 Angular 的建置與開發後,我們來看看 Angular 的世界包含了哪些角色,在今天先向大家介紹模組。 Modules 在日漸複雜的前端領域,...
簡述 SharedModule是共用模塊的集合地,此篇分兩篇來介紹常見的幾種共用模塊。 功能 後台製作的過程中,有許多功能是複用的。 DialogModule...
講完前面幾張比較偏向原理與不常使用到的章節後,從這章節開始會介紹比較實際運用的東西。 就像在 Day1 所提到的,Angular app 是由無數個大大小小的...
前言 回到網站的首頁,為了量化租戶管理的效能,通常會將資料數據透過圖表的方式呈現,在網路上可以找到許多套件與 Angular 搭配完成各種任務,今天要跟大家介紹...
簡述 AppComponent是系統內的 根組件,通常會建議寫部分服務的初始設定。 功能 開發過程中大概遇到幾種設定如下: 多語系初始設定 icon讀取圖片...
前言 所有前端框架都會遇到一個共同的問題,就是資料與狀態如何在組件之間傳遞,根據元件之間不同的組合關係,大致可分類為父子,兄弟與沒有關係,在 Angular 中...
本篇會介紹如何建立 component,以及用一些實際的功能說明上一篇的概念 實作出 layout 所需的 components 在實作 modules 的那篇...