在ngOnInit,我的组件获取用户列表,如下所示:
this.userService.getUsers().subscribe(users => {
this.users = users;
});
Run Code Online (Sandbox Code Playgroud)
userService.getUsers()的实现如下所示:
getUsers() : Observable<UserModel[]> {
return this.http.get('http://localhost:3000/api/user')
.map((res: Response) => <UserModel[]>res.json().result)
.catch((error: any) => Observable.throw(error.json().error || 'Internal error occurred'));
}
Run Code Online (Sandbox Code Playgroud)
现在,在另一个组件中,我有一个可以创建新用户的表单.问题是,当我使用第二个组件来创建用户时,第一个组件不知道它应该向后端发出新的GET请求以刷新其用户视图.我怎么能这样说呢?
我知道理想情况下我想跳过那个额外的HTTP GET请求,并且简单地追加客户端已经拥有的数据,当它进行POST以插入数据时,但是我想知道如何在这种情况下完成它无论出于何种原因,这都是不可能的.
Est*_*ask 18
为了使一个observable能够在初始Http observable完成后提供值,它可以由RxJS主题提供.由于缓存行为是可取的,因此ReplaySubject适合这种情况.
应该是这样的
class UserService {
private usersSubject: Subject;
private usersRequest: Observable;
private usersSubscription: Subscription;
constructor(private http: Http) {
this.usersSubject = new ReplaySubject(1);
}
getUsers(refresh: boolean = false) {
if (refresh || !this.usersRequest) {
this.usersRequest = this.http.get(...).map(res => res.json().result);
this.usersRequest.subscribe(
result => this.usersSubject.next(result),
err => this.usersSubject.error(err)
);
}
return this.usersSubject.asObservable();
}
onDestroy() {
this.usersSubscription.unsubscribe();
}
}
Run Code Online (Sandbox Code Playgroud)
由于主题已存在,因此可以在不更新服务器列表的情况下推送新用户:
this.getUsers().take(1).subscribe(users =>
this.usersSubject.next([...users, newUser])
)
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
23376 次 |
| 最近记录: |