[英]Angular2 EventEmitter with last value
基本上我想知道有沒有辦法在我訂閱EventEmmiter
后立即從EventEmmiter
獲取最后一個值?
為什么我需要這個。 想象一個列表組件,它使用了另外兩個組件:過濾器和網格。 Filter 提供filter
事件,grid 提供sorting
事件。
在我的列表組件中,我想編寫這樣的代碼:
Observable
.combineLatest(filtering$, sorting$)
.switchMap(([filter, sorting]) => {
return this.api.list(filter, sorting);
})
...
非常簡短的優雅代碼。 但是有兩個問題:
EventEmitter
是不可觀察的。 這不是什么大問題,因為我可以很容易地用 observable 包裝它。 目前我正在使用 RxJs 的BehaviorSubject
解決它:
表示隨時間變化的值。 觀察者可以訂閱主題以接收最后(或初始)值和所有后續通知。
在我的過濾器組件中,我有:
class UsersListFilter {
private filteringSource = new BehaviorSubject<UserFilter>(new UserFilter());
filtering$ = this.filteringSource.asObservable();
...
}
在我的列表組件中:
class UsersList {
@ViewChild(UsersListFilter) private filter: UsersListFilter;
...
setupDataReloading() {
Observable
.combineLatest(this.filter.filtering$, this.grid.sorting$)
...
}
}
如您所見,我根本不使用EventEmitter
。 但是這個解決方案在 Angular2 中感覺有點不自然,因為我忽略了與子組件( @Output
)交互的標准方式。
有什么想法嗎?
改用這個自定義類
import { EventEmitter } from '@angular/core';
import { ObjectUnsubscribedError } from 'rxjs';
export class CustomEventEmitter<T> extends EventEmitter<T> {
private _value: T;
constructor() {
super();
}
get value(): T {
return this.getValue();
}
getValue(): T {
if (this.hasError) {
throw this.thrownError;
} else if (this.closed) {
throw new ObjectUnsubscribedError();
} else {
return this._value;
}
}
emit(value?: T) {
super.emit(this._value = value);
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.