我有一个数据表,其中的一个元素更新后,其数据将刷新。
要触发数据刷新,我发送一个事件:
updateEvent = new EventEmitter<{ value: User }>();
refreshListForUser(user: User) {
this.updateEvent.emit({
value: user
});
}
事件是通过以下方式处理的:
merge(this.updateEvent, this.searchTermEvent, this.sort.sortChange, this.paginator.page)
.pipe(
startWith({}),
switchMap(() => {
this.isLoadingResults = true;
return this.getUsers(this.searchTerm, this.sort.active, this.sort.direction, this.paginator.pageIndex);
}),
map((usersApi: UsersApi) => {
this.isLoadingResults = false;
this.isRateLimitReached = false;
this.currentPageNumber = usersApi.currentPageNumber;
this.elementsPerPage = usersApi.elementsPerPage;
this.totalElements = usersApi.totalElements;
this.totalPages = usersApi.totalPages;
return usersApi.users;
}),
catchError(() => {
this.isLoadingResults = false;
this.isRateLimitReached = true;
return observableOf([]);
})
).subscribe((users: User[]) => {
this.dataSource.data = users;
});
}
它可以正常工作,可以刷新所有数据,并且列表是最新的。
但是如何检索事件中传递的用户对象?
对于这种用例,我应该使用事件发射器吗?归根结底,这都是一堂课。
对于相同的组件类中的另一个类似事件,我有相同的问题。
最好从搜索事件中检索搜索字符串,而不是使用成员变量:
searchTermEvent = new EventEmitter<{ value: string }>();
searchTerm: string;
search(searchTerm: string) {
this.searchTerm = searchTerm;
this.searchTermEvent.emit({
value: this.searchTerm
});
if (this.paginator) {
this.paginator.firstPage();
}
}