So implementieren Sie rollenbasiertes Aurelia-Routing

Question

Ich habe alle meine Routen in einer .ts-Datei, und meine main.ts kommt zur ersten Route, die sich in dieser Routes-Datei anmeldet. wo ich das linke Menü nicht laden möchte, und nach der Autorisierung werde ich entweder Kunde oder Support-Mitglied routen. Dort müssen meine Routen im linken Menü entsprechend der angegebenen Rolle ausgefüllt werden. Wie implementiert man sein Szenario?

Answer 1

Navigation in Aurelia basiert auf einer Reihe von Javascript-Objekten, die Sie an die Router-Konfiguration übergeben. Es gibt nichts, was es nicht erlaubt, diese Objekte zu erweitern, um zusätzliche Informationen zu Rollen zu enthalten. Sie sollten also in der Lage sein, ein Rollenfeld hinzuzufügen.

{ 
    route: ['', 'todo/list'], 
    name: 'ToDoList', 
    moduleId: './to-do/list', 
    nav: true, 
    title: 'To Do List', 
    authRoute: true, 
    role: 'TaskAdmin' 
} 

Wenn Sie dann Ihre Vorlage für die Navigation erstellen, möchten Sie diese basierend auf der Rolle und dem Navigationselement anzeigen.

<li repeat.for="navItem of router.navigation" class="${showNav(navItem) ? 'showNav' : 'hideNav'}"> 
    <a href.bind="row.href">${row.title}</a> 
<li> 

Die Funktion, die in der entsprechenden js-Code-Datei enthalten sein muss:

showNav(navItem) { 
    return localStorage.getItem("role") === navItem.role; 
} 

Es gibt mehr Möglichkeiten, die Authentifizierung einzurichten, die auch die Möglichkeit, eigene bauen umfasst, aber ich werde zeigen Sie auf ein paar.

Blog Post on Aurelia-Auth

Aurelia-Authentication documentation

Answer 2

Ich habe einen (nicht-ts) Kern einer einfachen rollenbasierte Navigation, durch die Saqib Antwort inspiriert.

Vielleicht hilft es jemand: aurelia role-based routing