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 :

我有两个出口:主要的应用路由器出口和一个名为"administration"的辅助出口.

I have two outlets : the main app router outlet, and a secondary outlet named 'administration'.

当我想在开始时浏览任何管理链接时，都可以正常工作.但是下次，当我尝试导航时，角度会抛出此错误消息:

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

Here is a stackblitz : 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屋！