2016-06-14 3 views
0

I eine Winkel Anwendung mit verschiedenen Arten von Seiten, die alle durch eine Schnecke direkt nach dem Basis-URL identifiziert, so wie:winkeligen offenen Controller/view basierend auf Serverantwort

http://example.com/slug-a 
http://example.com/slug-b 

Slug a und b sind von verschiedene Arten und müssen in einer anderen Ansicht gerendert werden. Die Daten, die zu den durch slug a und b identifizierten Objekten gehören, werden vom Server abgerufen, und die Angular-Anwendung soll die Ansicht basierend auf dem Objekttyp ändern.

Kann das im $ routeProvider von ngRoute gehandhabt werden? Ich kann keine Unterlagen finden, die mir dabei hilft, und ich bin sicher, ich bin nicht der erste, dies zu versuchen ..

Also, kurz gesagt:

  • Client fordert Slug A = > Angular fordern Daten vom Server => Angular Lasten ControllerA mit Vorlage A.
  • Client fordert slug B => vom Server Angular Daten anfordert => Angular Lasten mit Vorlage B ControllerB

Unterschiedliche Ansicht basierend auf Serverantwort.

+0

Es ist grundlegende Route Definition. Hast du die Route in deiner App konfiguriert? https://docs.angularjs.org/api/ngRoute/provider/$routeProvider. –

+0

Ja, ich habe mehrere Routen. Die letzte Route /: Slug fängt alle anderen Routen ab. Angular fordert Daten vom Server an (identifiziert durch den Slug-Parameter) und basierend auf den Daten, die zurückgegeben werden, muss ich eine bestimmte Vorlage anzeigen. (Der Slug könnte zum Beispiel ein Benutzername, ein Land oder eine Stadt sein. Benutzer, Länder und Städte werden mit verschiedenen Vorlagen angezeigt.) – Keugels

Antwort

0

Ich denke, dass Sie das nicht in Router tun können. Sie können Benutzer jedoch über den Dienst $location an einen anderen Standort umleiten. Gefällt Ihnen dieses

// somewhere inside your controller 
var promise = loadData().then(data => { 
    if (data.slugA) { 
     $location('path_to_slugA'); 
    } 
    else if (data.slugB) { 
     $location('path_to_slugB'); 
    } 
    else { 
    // do something else 
    } 
}); 
+0

Das würde nicht funktionieren. $ Location.path() kann nicht mehr geändert werden, da sich der Benutzer bereits an der richtigen URL befindet. Es muss nur eine andere Vorlage basierend auf den vom Server zurückgegebenen Daten geladen werden. $ Location.path() kann nicht geändert werden. – Keugels

+0

Ich sehe ... in diesem Fall einen Blick auf diese beiden Antworten http://stackoverflow.com/questions/24496201/load-html-template-from-file-into-a-variable-in-angularjs und http: //stackoverflow.com/questions/14788417/angular-load-template-from-url-and-compile-inside-div –

0

Ok, ich habe es mit einem anderen und viel einfacheren Ansatz gelöst. (Ich weiß nicht, warum ich das vorher nicht heraus)

$routeProvider.when('/:slug/', { 
    controller: 'SlugController', 
    template: '<div ng-include="template"></div>' 
}); 

Dann macht die SlugController die Anforderung und lädt die richtige Vorlage von $ scope.template Einstellung. In der Vorlagendatei wurde der Controller an das Root-Element angehängt.

Einfach, aber effektiv .. :)