Чтобы получить доступ к компонентам в текущем URL-пути, в моем приложении работает следующее:
constructor(private route: ActivatedRoute) { }
...
load() {
this.route.params.subscribe((params) => {
const id = +params['id'];
console.info('got parameter', id);
... etc
Это случай из учебника, и переменная я бы устанавливается как объявлено. Но я хочу использовать более элегантную форму Ждите, и она не работает. (Конечно, у меня будет следующая строка операторов Ждите.) Вот так:
async load() {
try {
console.info('getting parameters');
const params = await this.route.params.toPromise();
console.info('got params', params);
const id = +params['id'];
... etc
Я получаю результат первого вызова console.info (), но второй так и не приходит. И, конечно же, переменная я бы не устанавливается, а остальная часть кода никогда не выполняется.
В документации и рабочем коде сказано, что this.route.params - это Наблюдаемый, который должен быть преобразован в Обещать через обещать() и, таким образом, использоваться с Typescript асинхронный / Ждите. Я использую операторы Ждите с Наблюдаемые, которые отлично выходят из модуля HttpClient.
Но это не работает. Кто-нибудь знает почему?



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Основной ответ: У вас здесь неконтролируемые условия гонки
Когда вы получаете доступ к Observable route.params, вполне нормально, что он еще не завершен. Вызов toPromise() на нем в этот момент приведет к постоянно ожидаемому обещанию, и это проблема, с которой вы столкнулись.
Если вы не обязаны использовать эту конструкцию async await, оставьте ее и лучше напрямую обращаться к params.id синхронно через ActivatedRouteSnapshot.
ngOnInit() {
const id: string = route.snapshot.params.id;
}
Да, это сработало, но я не понимаю, почему в примерах, которым я следовал, использовалась форма Observables, что привело меня так далеко в заблуждение. Вдобавок я не понимаю, почему ActivatedRoute вообще использует Observables. Почему бы не установить маршрут и URL-адрес или статические во время создания компонента? Ну что ж, я исследую это позже. Спасибо за указатель.
По поводу вопроса ... почему ActivatedRoute вообще использует Observables ... AlanObject, причина в том, что ngOnInit() вызывается только при инициализации компонента, то есть при его создании. Представьте, что ваш компонент используется для отображения сведений об элементе с таким маршрутом, как /item/123, где 123 - текущий элемент ID.
Теперь, если ваш компонент будет реализовывать также ссылки Предыдущий и Следующий, ведущие к /item/122 и /item/124, компонент не будет создаваться снова. В таких случаях вам потребуется подписка или другой способ обновления ID и связанных данных.
Пожалуйста, не забудьте отметить этот ответ как решение, если он решил вашу проблему или ответил на ваш вопрос. Заранее спасибо.