В настоящее время я работаю в крупной корпорации, где мы недавно обновили приложение с Angular 2 до Angular 9.
Самая большая проблема, с которой мы сейчас сталкиваемся, связана с маршрутизацией. Мы подключаем роутер-розетку с помощью специального метода деактивации Этот метод аналогичен стандартному, но мы добавляем тайм-аут, чтобы у всех анимаций при переключении экрана можно было выбрать значение fini sh до уничтожения предыдущего маршрута.
RouterOutlet.prototype.deactivate = function() {
if (this.isActivated && !this.component.navAnimation) {
let destroy = this.activated.destroy;
let activated = this.activated;
activated.destroy = () => {
setTimeout(() => {
destroy.call(activated);
}, 600);
};
}
return deactivate.apply(this, arguments);
};
Проблема заключается в том, что она, похоже, вызывает проблему с отображением дочерних маршрутов.
Вот файл демонстрационного маршрута, испытывающий проблему
path: 'parent-path'
component: ParentComponent
children: [
{
path: '',
component: ChildHome
},
{
path: 'details',
component: Details
}
]
У меня есть выход маршрутизатора в родительском компоненте.
Этот код работал с Angular 2, но теперь, когда мы перейдем к родительскому пути / подробностям, URL будет переключаться правильно (трассировка маршрута также может найти маршрут), но будет отображаться домашний дочерний маршрут. Это не имеет ничего общего с этим файлом маршрута, так как эта проблема возникает во многих приложениях.
Если я закомментирую тайм-аут, анимация будет выглядеть ужасно, но она сможет загружать детей.
Я не получаю никаких ошибок.
Если кто-то знает, почему этот тайм-аут приводит к тому, что дочерние маршруты (дочерние маршруты, которые не являются дочерними по умолчанию) не загружаются, было бы здорово! Спасибо!