Параметры маршрута в угловом 2

Question

Я работаю над образцом приложения «Угловое 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), а затем сделать вызов метода обслуживания. Но поскольку для чтения есть два параметра маршрута, метод службы вызывается дважды.

Любая идея, что нужно изменить, чтобы один раз вызвать метод службы?

Answer 1

Ниже текст из this ссылки решить мою проблему.

Прямо сейчас, если при обнаружении изменений содержимого/просмотра дочерних элементов компонента происходит ошибка, ngOnInit будет вызываться дважды (см. В DynamicChangeDetector). Это может привести к последующим ошибкам, которые скрывают исходную ошибку.

В моем случае также произошла некоторая другая ошибка в моем компоненте, в результате чего ngOnInit() выполнялся дважды. Надеюсь, что это будет полезно для других. Я потратил 2 часа на эту проблему :(

Answer 2

Вы можете использовать switchMap:

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