iT邦幫忙

鐵人檔案

第 12 屆 iT 邦幫忙鐵人賽
回列表
Modern Web

Angular10 實作教學 系列

TypeScript 型別 - ENUM轉陣列(2)
圖片顯示 + 檔案上傳(1)
每條 API 添加 欄位(1)
Angular Material 日期使用(3)
Angular Material 替換色系(1)
資料傳遞處理 - @Input@Output 、Storage、Subject、Router(4)
重新整理再次取得資料(1)
Reactive Form 多層使用 + 驗證(4)
使用 leaflet 建構地圖(3)
圖表使用(3)

鐵人鍊成 | 共 30 篇文章 | 10 人訂閱 訂閱系列文 RSS系列文
DAY 21

NG10鐵人賽 - 21 - FormGroup 介紹

說明 英文 Note that just as a form group contains a group of controls, the profile f...

2020-09-21 ‧ 由 馬達 分享
DAY 22

NG10鐵人賽 - 22 - FormGroup 實作

說明 基礎使用可以看一下之前寫的文章 Angular6之表單-簡易Reactive Form https://ithelp.ithome.com.tw/arti...

2020-09-22 ‧ 由 馬達 分享
DAY 23

NG10鐵人賽 - 23 - FormArray 介紹

說明 英文 Tracks the value and validity state of an array of FormControl, FormGroup...

2020-09-23 ‧ 由 馬達 分享
DAY 24

NG10鐵人賽 - 24 - FormArray 實作

結果 html <form (ngSubmit)="onSubmit()" [formGroup]="form"...

2020-09-24 ‧ 由 馬達 分享
DAY 25

NG10鐵人賽 - 25 - ReactiveForm Validator 驗證

說明 static min(min: number): ValidatorFn 數字要高於等於 min static max(max: number): Val...

2020-09-25 ‧ 由 馬達 分享
DAY 26

NG10鐵人賽 - 26 - Template-Drive & Reacitve Forms 自訂驗證

Reactive Forms 自訂驗證 trim-required-validatorr.ts (自己手動建立檔案) import { AbstractCont...

2020-09-26 ‧ 由 馬達 分享
DAY 27

NG10鐵人賽 - 27 - ng2-charts github 導讀

安裝套件 cmd npm install ng2-charts@2.4.1 --save npm install chart.js --save 各種圖表展示...

2020-09-27 ‧ 由 馬達 分享
DAY 28

NG10鐵人賽 - 28 - ng2-charts github 樣板實作

chart-color.service.ts import { Injectable } from '@angular/core'; import { Char...

2020-09-28 ‧ 由 馬達 分享
DAY 29

NG10鐵人賽 - 29 - ng2-charts - bar 實例

html <canvas baseChart width="800" height="800" [datasets...

2020-09-29 ‧ 由 馬達 分享
DAY 30

NG10鐵人賽 - 30 - ng2-charts 新北市各行政區火災次數原因

結果 資料來源 JSON - 範例使用 API (會有 CORS 問題) SWAGGER 程式碼 chart.component.html <canva...

2020-09-30 ‧ 由 馬達 分享