在我的应用程序中,我在一个组件中有两个组合框。它们的默认值都是null
.
选择时间段或用户时,会将值发送到商店。这允许您在不同的组件中使用期间和选定的用户。
Combobox.component 存储:
onSelectedWalletsPeriod(period: Period) {
this.store.setSelectedWalletsPeriod(period);
}
onSelectedWalletsUser(user: User) {
this.store.setSelectedWalletsUser(user);
}
店铺:
export class MystoreComponentStore {
private selectedWalletsPeriodSubject = new BehaviorSubject<Period>(null);
private selectedWalletsUserSubject = new BehaviorSubject<User>(null);
public selectedWalletsPeriod$ = this.selectedWalletsPeriodSubject.asObservable();
public selectedWalletsUser$ = this.selectedWalletsUserSubject.asObservable();
constructor() {}
setSelectedWalletsPeriod(period: Period) {
this.selectedWalletsPeriodSubject.next(period);
this.selectedWalletSubject.next(null);
/# DEBUG #/
console.log('selectedPeriod:', period);
}
setSelectedWalletsUser(user: User) {
this.selectedWalletsUserSubject.next(user);
this.selectedWalletSubject.next(null);
/# DEBUG #/
console.log('selectedUser:', user);
}
}
存储到 Result.component:
export class ResultComponent implements AfterViewInit {
selectedWalletsPeriod: Period = null;
selectedWalletsUser: User = null;
constructor(public store: MystoreComponentStore) { }
ngAfterViewInit() {
this.store.selectedWalletsPeriod$.subscribe(period=> this.selectedWalletsPeriod = period);
this.store.selectedWalletsUser$.subscribe(user=> this.selectedWalletsUser = user);
}
}
要显示第二个组件的列表,我必须选择一个时期和一个用户。在那之前,一切都完美无缺。
但是我想做的是在选择用户和期间时执行一个功能。当更改两个组合框之一的值时,也会执行此函数。
此功能将允许我根据期间和用户从我的数据库中检索钱包列表。
我不知道怎么做。如果你有想法,我很感兴趣。
这是一个小例子:Stackblitz HERE
先感谢您。