Javascript ActivatedRoute paramMap observable发射值两次/发射两次-角度4

Javascript ActivatedRoute paramMap observable发射值两次/发射两次-角度4,javascript,angular,observable,Javascript,Angular,Observable,我在角度2/4和获取特定路线的参数时遇到问题。我这样做了几百次,从来没有遇到过这样的问题,正如您从我在路由上调用paramMap的代码中看到的,我希望它只运行一次,但不知何故它最终被调用了两次 这就像paramMap observable发射相同的值两次而不是一次。问题是,这样我向服务器发出两个请求,发送重复数据 export class UserComponent implements OnInit { user: User; submitted: Observable<

我在角度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"));
            });
    }
    .
    .
    .
}
导出类UserComponent实现OnInit{
用户:用户;
提交:可见;
建造师(
专用路由器:路由器,
专用路由:激活的路由,
私人服务:用户服务,
私有topicService:topicService
) {}
ngOnInit():void{
此为.route.data
.subscribe(res=>this.user=res.user);
//错误由解析器处理
this.submitted=this.route.paramMap
.switchMap((参数:ParamMap)=>{
//此参数使用相同的参数调用两次
返回此。topicService
.getUserSubmitted(params.get(“name”));
});
}
.
.
.
}

我使用解析器获取用户,同时根据route param(:name)获取数据(主题),事实上,仅此而已。

好的,我找到了解决方案,所以我将其放在这里

问题是在模板中有两个元素的session | async我基本上订阅了两次相同的可观察对象(在模板初始化时)

。。。
没什么可展示的。用户尚未提交任何主题。
Angular.io文档:

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

资料来源:


嘿,你能把你的答案作为答案而不是问题发布吗?所以acceps(甚至鼓励)QA风格:发布一个问题和你自己的答案。这样,这个问题就不会被标记为“未回答”,你也会帮助其他有类似问题的人。谢谢你的提示。我已经按照你的建议做了。
<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>