HarveyChou
|
32b24fb072
|
查詢字串的傳遞與取得=> page使用
可以往前往後,使用queryParamsHandling: 'preserve'來紀錄先前的資料
|
2 years ago |
HarveyChou
|
d98de591b6
|
監控路由參數,藉由paramMap
此commit可以抓到page,但是無法傳遞參數至下一筆資料
可能跟assets/tasks.json讀取有關
|
2 years ago |
HarveyChou
|
9c81fb93ce
|
嘗試建立routing,藉由路由參數傳遞與取得
能夠傳遞參數至Url,但是取得參數失敗
TaskService get method,參數Observable<Task | any>,需代入any不然會報錯
|
2 years ago |
HarveyChou
|
7b0f195e8c
|
Routing的運用
修改task.service,get的位址改為../assets/tasks.json,不然會抓不到
|
2 years ago |
HarveyChou
|
ee4fc57944
|
自訂表單元件
修改部分fn Task改為any,規避TypeScript強型別問題,會導致編譯錯誤
修改task.ts 參數增加驚嘆號,不然需要設定初值
|
2 years ago |
HarveyChou
|
7557881de0
|
表單驗證的設定
變更代辦事項狀態"已完成",必須要輸入完成日期
Angular 提供addValidators() setValidators() and removeValidators()
設定表單驗證後,都要呼叫updateValueAndValidity(),執行最後的驗證
|
2 years ago |
HarveyChou
|
2b72de571b
|
表單陣列結構的操作
預設數量只會根據原模型數量去設定
包含push method,可以加入新的Formgroup
|
2 years ago |
HarveyChou
|
156303b3b5
|
表單值的存取,使用patchValue
|
2 years ago |
HarveyChou
|
8b7bc94401
|
表單值的存取監控
使用debounceTime(500),每500毫秒檢查一次
|
2 years ago |
HarveyChou
|
021d3064c7
|
自訂欄位非同步驗證方法
要同時輸入帳號以及密碼,下方才會顯示出結果
|
2 years ago |
HarveyChou
|
28507f4648
|
數值驗證方法=>自訂欄位同步驗證方法
|
2 years ago |
HarveyChou
|
3c9aac7f93
|
自訂欄位同步驗證方法,表單陣列不得為空
範例程式有問題,此次commit無法使用,arrayCannotEmpty內部不可為null
|
2 years ago |
HarveyChou
|
1b854b85d3
|
表單欄位驗證validator
|
2 years ago |
HarveyChou
|
9241462772
|
響應式表單> 利用FormArray建立表單陣列
|
2 years ago |
HarveyChou
|
f783a95867
|
響應式表單,FormGroup
可以將form item 當作group
|
2 years ago |
HarveyChou
|
df83d27fb6
|
響應式表單
利用FormControl建立單一欄位表單,並用console紀錄
|
2 years ago |
HarveyMac
|
2b8dc6ef02
|
使用Httpclient的http get功能取得資料
|
2 years ago |
HarveyChou
|
46489b32cd
|
[Doc] 報告更新
|
2 years ago |
HarveyChou
|
2339adb55f
|
自訂表單驗證
|
2 years ago |
HarveyChou
|
b95b30b8cc
|
正規畫表示驗證
|
2 years ago |
HarveyChou
|
965e75a963
|
數值欄位範圍驗證
tsconfig.json 內部要更改noPropertyAccessFromIndexSignature:false
最小年齡為 {{ age.errors?.min.min }} 歲 要加一個問號
|
2 years ago |
HarveyChou
|
a16c194117
|
email格式驗證
|
2 years ago |
HarveyChou
|
6300ff8946
|
表單是否修改過
使用pristine跟dirty屬性來辨別
|
2 years ago |
HarveyChou
|
8403b4c9ec
|
ng-tounched 屬性
若點選過帳號,或者表單,則外框顏色會變色
|
2 years ago |
HarveyChou
|
1f6eff2cdf
|
NgModelGroup 表單範例
可以使用MgModelGroup,將ngModel結合成一個group
|
2 years ago |
HarveyChou
|
04a409ffbb
|
ngForm表單範例
|
2 years ago |
HarveyChou
|
0a1f3bf84a
|
ngModel加入範本參考變數
|
2 years ago |
HarveyChou
|
6d39774248
|
利用NgModel定義表單模型屬性
透過ngModel紀錄在condition中,讓元件程式可以使用此屬性進行查詢
|
2 years ago |
HarveyChou
|
87ab8aebfd
|
@Host裝飾器
將元件的父層元素作為尋找注入實體的結束位置
<app-parent>
<app-child/>
</app-parent>
|
2 years ago |
HarveyChou
|
8fd056e445
|
@Self裝飾器
指定使用當下注入器,若當前未設定,則會拋出例外
|
2 years ago |
HarveyChou
|
a65445da8f
|
@Optional 選擇性注入
@SkipSelf()會忽略當錢provider,從使用的父元件開始尋找提供者
|
2 years ago |
HarveyChou
|
04ed2d5a29
|
HttpClient 把資料傳到後端服務
this.heep.pose<Task[]>(url,tasks);
使用HTTP_INTERCEPTORS攔截http請求,依據需求作其他處理
ng generate interceptor [component]
|
2 years ago |
HarveyChou
|
e02327cd32
|
Async Timer使用,實作subscribe跟unsubscribe
如果未取消unsubscribe,則會造成重複執行,降低效能
|
2 years ago |
HarveyChou
|
2ee49d413e
|
AsyncPipe 加入as關鍵字,建立範本區域變數,紀錄遠端傳回的清單資料
|
2 years ago |
HarveyChou
|
ddc8e2af5a
|
AsyncPipe
透過AsyncPipe訂閱task$屬性
|
2 years ago |
HarveyChou
|
1900c0e758
|
HttpClient取得遠端資料
app.component內部subscribe未註冊,程式碼範例無法註冊使用
|
2 years ago |
HarveyChou
|
fb01bb33eb
|
Merge branch 'master' of http://www.origtek.com:2999/HarveyChou/AngularLearn
|
2 years ago |
HarveyMac
|
5d8ca49605
|
使用相同token,指定多種provider
|
2 years ago |
HarveyMac
|
c6818ba1e1
|
Injection Token
建立InjectionToken型別變數來產生token
|
2 years ago |
HarveyMac
|
1d27146504
|
string Token
使用字串作為Inject token
|
2 years ago |
HarveyMac
|
6fdc2b3792
|
Service 單獨在個別個別component使用
provider可以使用範圍,在component中使用useValue,可以將可以將service限制在指定module中
|
2 years ago |
HarveyMac
|
d8c39876e6
|
FactoryService使用
可以使用useFactory設定條件,來使用不同的Service
|
2 years ago |
HarveyMac
|
0947394269
|
useValue抽象服務
可將物件實體抽換掉服務類別,可以透過建立間諜SPY物件模擬測試情境
|
2 years ago |
HarveyMac
|
776711cc2a
|
useExisting 抽象服務
跟useClass類似,但不會建立新的實體,而是去使用當前已存在的
如果不存在任何實體則會拋出例外,可以用這種方式減少被重複建立的實體
|
2 years ago |
HarveyMac
|
13726233ea
|
UseClass抽象服務
App.component內部provider使用useClass:OrderDiscountService
可以直接抽換原本的訂單服務,降低改版對於整體的影響
|
2 years ago |
HarveyMac
|
861c679ce1
|
Service Interaction ,Service 水平互動
APP.component初始化Service Value
font-size 使用畫面改變Value
other則顯示出則顯示出Value值
|
2 years ago |
HarveyMac
|
d506925fb7
|
使用service注入功能
task.service的gettasks,注入app.component.ts constructor
|
2 years ago |
HarveyMac
|
6e9b7d075a
|
自訂Pipe使用,使用 ng generate pipe [管道名稱]
本範例使用自訂Orderby排序
|
2 years ago |
HarveyMac
|
db845bfee2
|
DatePipe,詳細請查閱網路用法
|
2 years ago |
HarveyMac
|
93245b6bc7
|
CurrencyPipe
|
2 years ago |