Definieren von Routenlinks außerhalb der App-Vorlage in Angular 2

Ich habe mich gerade gefragt, ob es eine schlechte Übung ist, angular2-App-Router-Links außerhalb der App zu definieren. oder wenn es einen besseren Weg gibt, es zu tun.Definieren von Routenlinks außerhalb der App-Vorlage in Angular 2

In der gesamten angular2-Dokumentation finden Sie Beispiele für das Routing und definiert die Links innerhalb der App-Vorlage (siehe unten).

@Component({ 
    selector: 'my-app', 
    template: ` 
    <h1>Component Router</h1> 
    <nav> 
     <a [routerLink]="['CrisisCenter']">Crisis Center</a> 
     <a [routerLink]="['Heroes']">Heroes</a> 
    </nav> 
    <router-outlet></router-outlet> 
    `, 
    directives: [ROUTER_DIRECTIVES] 
}) 
@RouteConfig([ 
    {path:'/crisis-center', name: 'CrisisCenter', component: CrisisListComponent}, 
    {path:'/heroes',  name: 'Heroes',  component: HeroListComponent} 
]) 
export class AppComponent { }

In diesem Beispiel definieren sie die Verbindungen mit <a [routerLink]="['CrisisCenter']">Crisis Center</a>.

Aber was, wenn ich dies tat:

<html> 
    <head></head> 
    <body> 
     <nav> 
      <a href="#/crisis-center">Crisis Center</a> 
     </nav> 

     <div> 
      <my-app></my-app> 
     </div> 
    </body> 
</html>

Würde das für die Navigation innerhalb der App?

Der Grund, warum ich sie außerhalb der App behalten möchte, ist, dass ich viele Zugriffsrechte (Verbergen/Anzeigen) basierend auf Symfony-Variablen habe, also würde ich lieber die Menüs damit verwalten.

Quelle

2016-03-31 xil3

Das wäre in Ordnung, aber der Hauptgrund für die Verwendung von RouteConfig und Router-Outlet ist, weil es diesen Teil der Seite in Router Outlet lädt, ohne die Seite zu aktualisieren. Wenn Sie also normale Anchor-Tags verwenden, ist dies kein SPA (Single-Page-Application) mehr.

Quelle

2016-03-31 20:06:32 philoniare

Ja, aber die Art, wie ich es tue, würde die Seite auch nicht aktualisieren. Wenn sie auf den Link mit 'href = '#/crisis-center' klicken, sollte sie die URL-Änderung übernehmen und die eckige Seite in den Router-Ausgang laden. – xil3

Angular 2 unterstützt zwei Arten von URLs: '/ crisis-center /' und '#/crisis-center /'. Es ist über 'LocationStrategy' Provider konfigurierbar:' PathLocationStrategy' und 'HashLocationStrategy'. Wenn Sie diese Funktion nutzen möchten, dann [RouterLink] wäre der Weg zu gehen. [Mehr Infos] (https://angular.io/docs/ts/latest/guide/router.html#!#browser-url-styles) – creator

Definieren von Routenlinks außerhalb der App-Vorlage in Angular 2

Antwort

Verwandte Themen