Angular-Routing

Name: Angular-Routing
Author: Michaela Ochnich

Dieses Kapitel behandelt die Routing-Dienste von Angular. Sie lernen, wie Sie Child-Routen und eingeschränkte Routen erstellen, auf die nur bestimmte Benutzer zugreifen können.

Preview the first lesson free — get full access to all 6 lessons.

Demo anfragen Anmelden

Kurs: On-Demand

Diese Lektion wird demonstrieren wie man besteht und Parameterwerte vom Winkelrouter abrufen. Die App, die ich hier habe, wurde also mit Routing mit dem erstellt CLI-Tool. Diese Routing-Modul-Datei ist also bereits konfiguriert und in das Routenmodul der Anwendung importiert. Das hier von angle importierte Routermodul enthält verschiedene Richtlinien und Anbieter, die in Anwendungsnavigation. Dazu gehören der Router-Link, der aktive Router-Link und die Router-Outlet-Direktiven sowie den Router-Dienst. Angenommen, Sie erstellen für diese Demo eine Webanwendung für ein Immobilienunternehmen. Eine der Funktionen, die Sie möglicherweise benötigen, ist eine Seite, auf der die verfügbare Eigenschaften, und dann auf diese Eigenschaftsliste klicken sollte den Benutzer aufnehmen zu einer Seite mit weiteren Details zu dieser bestimmten Eigenschaft. Um das einzurichten, Ich werde zuerst eine Komponente generieren, die eine Liste anzeigt der Eigenschaften und dann eine Komponente, die die Angaben zu unserem Objekt. Also hier, die Artikellistenkomponente dient zur Anzeige aller Auflistungen und die Artikelkomponente dienen der Anzeige eines individuelle Auflistung. Ich werde auch eine Komponente generieren, die als Homepage fungiert. Um nun Routen für diese drei Komponenten zu erstellen, Ich muss sie zuerst in dieses App-Routing-Modul importieren Datei. Als nächstes hier unten, und die Routen sind richtig. Ich werde zuerst eine Route für die Homepage definieren. Und als nächstes erstelle ich eine Route für die Artikelliste Komponente. Nun zur Artikelkomponente, Ich muss die ID des Artikels in der Route übergeben. Auf diese Weise, wenn diese App an ein Back-End angehängt wurde, es könnte diese ID verwenden, um die Daten für die Auflistung abzurufen, aus der Datenbank. Um einen Parameter in einem Routenpfad zu kennzeichnen, Setzen Sie einen Doppelpunkt vor den Parameternamen. Diesen Weg, Der Winkelrouter weiß, dass dies ein Parameter ist, der wird bestanden. Und es versucht nicht, den Pfad der Wort-ID zuzuordnen. Wenn es nach einer passenden Route sucht. Und dieser Parameterwert wird im Link übergeben Wenn ein Benutzer auf ein bestimmtes Element aus der Liste klickt. Da es für diese App kein tatsächliches Back-End gibt, Ich habe einen Dienst erstellt, der einige grundlegende simulierte Daten zurückgibt nur zu Demonstrationszwecken. Im Dienst sind zwei Funktionen definiert. Eine, die alle Auflistungsdaten zurückgibt, und eine, die eine ID und gibt diese bestimmten Auflistungsdaten zurück. Und um die Einrichtung des Routers abzuschließen. Ich muss auch die Router-Steckdose hinzufügen. Also öffne ich die Routenkomponentenvorlage und lösche den gesamten Startercode und ersetze ihn dann durch diese Router-Steckdose. Jetzt, wo es ein Outlet gibt, um die Routen in der Aussicht, Ich werde einen Link von der Homepage-Komponente zu erstellen diese Listenkomponente. Um nun einen Link für den Winkelrouter zu erstellen, Sie möchten das H-ref-Attribut nicht verwenden. Dies ist eine einseitige Anwendung, Daher möchten wir nicht zu einer neuen HTML-Seite navigieren. Stattdessen, die Router-Link-Direktive wird verwendet.

Mittelstufe Anbieter : Michaela Ochnich 6 Lektionen · 33m auf Arabisch, Deutsch, Englisch, Spanisch, Französisch, Portugiesisch, Chinese

Kursbeschreibung

Dieses Kapitel behandelt die Routing-Dienste von Angular. Sie lernen, wie Sie Child-Routen und eingeschränkte Routen erstellen, auf die nur bestimmte Benutzer zugreifen können. Sie erfahren, wie das Erstellen relativer Links in Ihrer Angular-Anwendung beim Refactoring helfen kann und wie Sie die aktuellen Routenparameter von einer Komponentenklasse abrufen können.

Was Sie lernen werden

Erstellen Sie verschiedene Arten von Angular-Routen mit Angulars Routing-Services
Erstellen Sie untergeordnete Routen innerhalb einer Angular-Anwendung
Beschränken Sie den Zugriff auf Routen, sodass nur bestimmte Benutzer auf sie zugreifen können
Erstellen Sie relative Links, um die Umgestaltung zu erleichtern
Rufen Sie die aktuellen Routenparameter aus einer Komponentenklasse ab

Wichtige Erkenntnisse

Angular bietet Routing-Services zum Erstellen und Verwalten von Routen in einer Anwendung.
Routen können als untergeordnete Routen und als eingeschränkte Routen konfiguriert werden, die nur bestimmte Benutzer aufrufen können.
Die Verwendung von relativen Links in einer Angular-Anwendung kann bei der Umgestaltung helfen.
Die aktuellen Routenparameter können innerhalb einer Komponentenklasse abgerufen werden.

Häufig gestellte Fragen

Was behandelt dieses Angular-Routing-Kapitel?

Es behandelt Angulars Routing-Services, einschließlich wie man untergeordnete Routen und eingeschränkte Routen erstellt, die nur bestimmte Benutzer aufrufen können, wie relative Links bei der Umgestaltung helfen und wie man die aktuellen Routenparameter aus einer Komponentenklasse abruft.

Was werde ich nach Abschluss dieses Kurses tun können?

Sie verstehen, wie Sie verschiedene Arten von Angular-Routen erstellen können und lernen, wie Sie den Zugriff auf eine Route beschränken.

Welche Lektionen sind in diesem Kapitel enthalten?

Das Kapitel enthält Route Info Part 1, Route Info Part 2, Route Info Part 3, Relative Routes, Child Routes und Restricted Route.

Erklärt dieser Kurs, wie man begrenzt, wer eine Route erreichen kann?

Ja. Es lehrt, wie man eingeschränkte Routen erstellt, die nur bestimmte Benutzer aufrufen können und wie man den Zugriff auf eine Route beschränkt.