webentwicklung-frage-antwort-db.com.de

Angular 7 - Mehrere Steckdosen: Fehler: Eine bereits aktivierte Steckdose kann nicht aktiviert werden

Hier ist das Problem, auf das ich stoße Angular 7:

Ich habe zwei Steckdosen: die Haupt-App-Router-Steckdose und eine sekundäre Steckdose mit dem Namen "Administration".

Wenn ich zu Beginn durch einen Administrationslink navigieren möchte, funktioniert dies einwandfrei. Aber wenn ich das nächste Mal versuche zu navigieren, gibt angular diese Fehlermeldung aus:

Fehler: Eine bereits aktivierte Steckdose kann nicht aktiviert werden

Kann mir jemand erklären warum? Ich habe in Foren keine Lösung gefunden ...

Hier ist ein Stackblitz: https://stackblitz.com/edit/angular-osnnd4

Vielen Dank an alle :)

11
Anthony Coucke

Das Problem tritt beim Lazyloading von untergeordneten Routen auf. Sie müssen die Steckdose jedes Mal manuell deaktivieren, wenn Sie eine Route ändern.

Ich habe Ihre AdministrationComponent wie folgt geändert, um sie zu umgehen. Es sollte vorerst funktionieren können, bis Angular eine Möglichkeit haben, das Problem zu lösen.

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();
    });
  }
}
14
Lee GuoHong

Das mag albern sein, aber für alle, die nach einer Lösung suchen: Stellen Sie sicher, dass in keinem der inneren oder untergeordneten Steckdosen eine undefinierte Variable vorhanden ist.

Ich habe dies in meinem Projekt behoben und alles ist wieder normal.

7
B. León