We all know and love the @Output()
decorator. If you are working with Angular I'm sure you've done this before:
@Output()
change = new EventEmitter<ChangeEvent>();
However, the lesser known fact is, that the property decorated by the @Output
does not have to be an EventEmitter
.
In fact, it can be an RxJS Observable
. It opens up a lot of possibilities, because we can wield the full power of RxJS operators 😱
For example, you can have an Output()
decorating your reactive form control's valueChanges
stream.
control = new FormControl('');
@Output()
valueChages$ = this.control.valueChanges
.pipe(
distinctUntilChanged()
);
Here you can see I'm limiting the emitted values to only the distinct ones, but other operators such as debounceTime
could be used as well.
Hope you're having a great one, and I'll see you for more 60 Seconds of Angular posts in the future 🥳
Top comments (1)
Sweet!