Angular 2中的路由参数

我正在处理Angular 2示例应用程序，下面是我的一个组件的代码。Angular 2中的路由参数

export class ProductComponent implements OnInit { 

    product:Product; 

    constructor(private appService: AppService , private router:Router ,private route:ActivatedRoute) {} 

ngOnInit() 
{ 

    let id:string; 
    let pid:string; 

    this.route.params.subscribe((params) => { 
    id = params['id']; 
    pid = params['pid'];  
    this.appService.GetProduct(id,pid).subscribe(data => { 
     this.product = data; 
    }); 
})

}

在这种partcular成分，我的意图是读两种路由参数（ID，PID），然后对服务方法的调用。但由于要读取2个路由参数，服务方法被调用两次。

任何想法需要修改什么以便服务方法被调用一次？

来源

2016-12-25 refactor

你说'this.appService.GetProduct（）'被调用两次，因为有两个路由参数？ – inspired

以下文字来自this链接解决了我的问题。

现在，如果在检测组件的内容/视图子级更改期间发生错误，ngOnInit将被调用两次（在DynamicChangeDetector中可见）。这可能导致跟踪错误，从而隐藏原始错误。

在我的情况下，我的组件还有一些其他错误，导致ngOnInit（）执行两次..希望这对其他人有用。我在这个问题上花了2小时:(

来源

2016-12-25 17:34:57 refactor

您可以使用switchMap：

this.route.params 
.switchMap(({id, pid}) => appService.GetProduct(id,pid)) 
.subscribe(data => this.product = data);

来源

2016-12-25 16:23:13 undefined

Angular 2中的路由参数

回答

相关问题