
打通 RxJS 任督二脈
昨天我們介紹了一個簡單的方法來實作 two way binding,這種方法在很多情境都非常好用,不過他還是有一些小問題,有些我們會需要在表單中使用自己設計的元件,但若使用 @Input 加上 @Output 的方法,會無法使用到在 Angular 中表單控制項的一些好處,例如加上驗證器的功能,也沒有一些如 ng-dirty 、 ng-invalid 等 CSS class 可用。因此今天我們來聊聊如何自己設計一個表單控制項吧!
在 Angular 中,通常我們會使用 [(ngModel)] 來實現 two way binding,這樣做基本上沒有什麼問題,但 ngModel 只能 binding 在常見的表單控制項上,如 input、select 等,難以自行在元件上時作出 two way binding,雖然還是可以做到,但相對麻煩了一點,今天就先來講一個簡單的實現 two way binding 的技巧吧!