我在
中使用了observable服务
getMembers(): Observable<any[]> {
return this._http.get('http://localhost/membership/main/getUsers')
.map(response => response.json() );
}
组件
members$: Observable<any[]>;
ngOnInit() {
this.members$ = this._membersService.getMembers()
}
请求
-getUsers
-getUsers
都返回相同的JSON数据
每次加载页面时都会返回重复请求。这不是关于冷热要求。因为两个请求都返回相同的响应。但是当我删除了observable时,一切都还可以。只有一个请求
答案 0 :(得分:8)
我猜您在模板中的两个不同位置使用async
管道。为避免重新执行请求,您可以使用share
运算符
import 'rxjs/add/operator/share';
members$: Observable<any[]>;
// I personally prefer to set observables in ctor
constructor() {
this.members$ = this._membersService.getMembers().share();
}
有关该运营商的更多信息,请访问here
另一种方法是在async
的帮助下在一个地方使用ng-container
管道:
//template
<ng-container *ngIf="members$ | async as members">
<span *ngIf="members.length === 0; else showMembers">No members!</span>
<ng-template #showMembers>
<div *ngFor="let member of members">{{member | json}}</div>
</ng-template>
</ng-container>
答案 1 :(得分:0)
如果您在 Angular 6 + 中遇到此问题,请进行更新。
import { share } from 'rxjs/operators';
...
this._membersService.getMembers().pipe(share());
现在是正确的语法。