Angular 7 - 多个插座:错误:无法激活已激活的插座 [英] Angular 7 - Multiple outlets : Error: Cannot activate an already activated outlet
问题描述
这是我在 Angular 7 中遇到的问题:
Here is the issue that I'm encountering with Angular 7 :
我有两个插座:主应用路由器插座和一个名为管理"的辅助插座.
I have two outlets : the main app router outlet, and a secondary outlet named 'administration'.
当我想在开始时浏览任何管理链接时,它工作正常.但是下一次,当我尝试导航时,angular 会抛出此错误消息:
When I want to navigate through any administration link at start, it works fine. But next time, when I try to navigate, angular throws this error message :
错误:无法激活已激活的插座
Error: Cannot activate an already activated outlet
那么,有人可以解释我为什么吗?我在论坛上没有找到任何解决方案...
So, can someone explain me why ? I haven't found any solution on forums...
这是一个堆栈闪电战:https://stackblitz.com/edit/angular-osnnd4
谢谢大家:)
推荐答案
延迟加载子路由时出现问题.每次更改路线时,您都必须手动停用插座.
The problem occurs when lazyloading child routes. You have to manually deactivate the outlet everytime you change a route.
我已将您的 AdministrationComponent 修改为如下解决方法.现在应该可以工作,直到 Angular 有办法解决问题.
I have modified your AdministrationComponent to workaround as follow. It should be able to work for now, until Angular have a way to solve the problem.
import { Component, OnInit, ViewChild } from '@angular/core';
import { RouterOutlet, Router, ActivationStart } from '@angular/router';
@Component({
selector: 'app-administration',
templateUrl: './administration.component.html',
styleUrls: ['./administration.component.css']
})
export class AdministrationComponent implements OnInit {
@ViewChild(RouterOutlet) outlet: RouterOutlet;
constructor(
private router: Router
) { }
ngOnInit(): void {
this.router.events.subscribe(e => {
if (e instanceof ActivationStart && e.snapshot.outlet === "administration")
this.outlet.deactivate();
});
}
}
这篇关于Angular 7 - 多个插座:错误:无法激活已激活的插座的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!