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抽象服務
可將物件實體抽換掉服務類別，可以透過建立間諜ＳＰＹ物件模擬測試情境
|
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 |
|
HarveyMac
|
cc3a013026
|
PercentPipe
{{value_expression | percent [:'digitsInfo' [:local]}}
|
2 years ago |
|
HarveyMac
|
9679033e34
|
數值資料顯示-DecimalPipe
|
2 years ago |
|
HarveyMac
|
691065d11b
|
KeyValuePipe
可以提取出陣列中的陣列中的keyValue
|
2 years ago |
|
HarveyMac
|
ee9fae2d12
|
SlicePipe，可以做文字排版切割，起始位置從0算起
{{value_expressiong |slice: start [:end]}}
也可以套用在陣列中
|
2 years ago |
|
HarveyMac
|
3e094d0490
|
使用angular 內部pipe，做顯示文字格式的改變
只改變顯示文字，而不改變文字內容
|
2 years ago |
|
HarveyMac
|
5bd08dfd5c
|
@HostBinding 裝飾器
可以設定class屬性，去影響宿主元素
|
2 years ago |
|
HarveyMac
|
084ded3405
|
@HostListener 裝飾器
可以用來listen mouseover跟mouseout事件
改變顏色
|
2 years ago |
|
HarveyChou
|
c89e69a77c
|
自訂結構型指令 Structural Directive
可以使用user Name來定義使用權限，顯示使用者可視或不可視區域
|
2 years ago |
|
HarveyChou
|
81f605ef39
|
自訂改變元素行為的屬性行指令
使用者按下按鈕後，會透過@HostListener擷取按鈕事件，讓使用者確認後觸發confirm事件，讓父元件執行所需作業
|
2 years ago |
|
HarveyChou
|
44795b7dfc
|
@directive Exports as 用法
用以取得自訂按紐指令實體
|
2 years ago |
|
HarveyChou
|
e0cad3232f
|
自訂Angular 指令 ==> 自訂變更元素樣式的屬性型指令(Attribute directive)
|
2 years ago |
|
HarveyChou
|
dea772bd15
|
ngComponentOutlet 範例
|
2 years ago |
|
HarveyChou
|
7f6d0b3765
|
ngSwitch 多條件判斷
|
2 years ago |
|
HarveyChou
|
aa2d25fae5
|
ngIf 將元素list移至 ng-template
|
2 years ago |
|
HarveyChou
|
a76881a140
|
ngIf 跟 else 實作
|
2 years ago |
|
HarveyChou
|
186bdbf526
|
ngFor 跟 traackBy用法，trackBy用法可以用以重新渲染功能
|
2 years ago |
|
HarveyChou
|
e9b3941c98
|
[Doc] LearnPowerPoint
|
2 years ago |
|
HarveyChou
|
0c38fa1d20
|
頁面檢視的初始and變更檢測
|
2 years ago |
