ActiveRoute paramMap observable 发出两次值/触发两次 - Angular 4



我在使用 Angular 2/4 时遇到问题,并获取特定路由的参数。我这样做了一百次,从来没有遇到过这样的问题,正如你从我在路由上调用 paramMap 的代码中看到的那样,期望它只会运行一次,但不知何故它最终被调用了两次。

这就像paramMap observable发出相同的值两次而不是一次。问题是这样我向我的服务器发出两个请求发送重复数据。

export class UserComponent implements OnInit {
user: User;
submitted: Observable<Topic[]>;
constructor(
private router: Router,
private route: ActivatedRoute,
private service: UserService,
private topicService: TopicService
) {}
ngOnInit(): void {        
this.route.data
.subscribe(res =>  this.user = res.user); 
// Error is handled by resolver
this.submitted = this.route.paramMap
.switchMap((params: ParamMap) => {
// THIS ONE IS INVOKED TWICE WITH SAME PARAMS
return this.topicService
.getUserSubmitted(params.get("name"));
});
}
.
.
.
}

我使用解析器获取用户,同时我根据路由参数(:name(获取数据(主题(,实际上就是这样,仅此而已。

好的,我已经找到了解决方案,所以我把它放在这里。

问题是在我的模板中与两个元素进行session|async时,我基本上订阅了两次相同的可观察量(在模板初始化时(。

<div *ngFor="let submit of submitted|async" class="submits">...</div>
<!-- and one more  --> 
<em *ngIf="!(submitted|async)?.length">
Nothing to show. User has not submitted any topics.
</em>

Angular.io 文档:

异步管道订阅可观察量或承诺,并返回它发出的最新值。发出新值时,异步管道会标记要检查更改的组件。当组件被销毁时,异步管道会自动取消订阅以避免潜在的内存泄漏。

源:

角度 - 异步管

最新更新