2015-11-11 10 views
14

Ich bin mit Winkel 1.5 beta 2 und den neuen Router von Angular 2 alpha 45.
ich nicht Anwendungsbeispiele für die neueste Router mit kantigem 1.
finden konnte, die ich finden kann Beispiele für die Verwendung des Routers für Angular 2 mit @RouteConfig.Angular 1.5 und neue Komponenten Router

Kann jemand erklären, wie ich einen eckigen 1 Controller konfigurieren würde? Und, wenn möglich, ein voll funktionsfähiges Beispiel?

Antwort

14

Aktualisierung Sie haben aufgehört, an dieser Version des Routers zu arbeiten, und haben eine Version 3 mit verschiedenen APIs gestartet. As of June 20, 2016 there was no recommended way für die Verwendung des Routers v3 mit Angular 1. Ich bin mir nicht sicher, ob sich das seit dem geändert hat. Diese Frage und Antwort bezieht sich auf Router v2 (aka ComponentRouter).


Veraltet API
Einige Seiten anzuzeigen, dass eine Komponente in Angular 1 (für den Zweck des neuen Router) ein Controller als [name]Controller und eine Schablone aufgenommen von component/[name]/[name].html registriert ist. Dies ist jetzt veraltet.

Neue API
Diese discussion enthält aktuelle Informationen, die erklärt, wie die neueste Angular 1 neue Router-Version zu erhalten.

Die in der Konfiguration verwendete Komponente wird einer Direktive zugeordnet, die mit dem Komponentennamen registriert ist. Siehe hierzu sample.

angular.module('app.home', []) 
.directive('home', function() { 
    return { 
    template: 'Hello {{ home.text }}', 
    controller: function HomeController() { 
     this.text = 'World'; 
    }, 
    controllerAs: 'home' 
    } 
}); 

mit kantigem 1.5 gibt es eine neue Syntax-Komponenten für die Registrierung finden Sie here. Ich habe es mit dieser Syntax:

angular.module('app.home', []) 
.component('home', { 
    restrict: "EA", 
    template: 'Hello {{ home.text }}', 
    controller: function HomeController() { 
    this.text = 'World'; 
    } 
    // to configure a child route 
    //,$routeConfig: [ 
    // { aux: "/son", component: "son", as: "Left" }, 
    // { aux: "/daughter", component: "daughter", as: "Left" }] 
}); 
+0

eine andere Probe bei https://github.com/brandonroberts/angularjs-component-router Gefunden – pauloya

+0

ich nicht richtig Routen einrichten Kind könnte, und nicht eine Arbeitsprobe mit Kind Routen – pauloya

+0

Die Diskussion über die Winkel finden konnten, github führte zu dieser Demo mit einer Kinderroute http://plnkr.co/edit/ZZQgWfspvpmMCLRBOdN?p=preview – pauloya

4

Obwohl es an diesem Punkt ziemlich neu ist, dass Sie auch eine Wurzelkomponente mit dem neuen Winkel Router verwenden können. Diese Komponente könnte zusätzliche Komponenten als untergeordnete Elemente aufnehmen.

Ich folgte Pete Bacon Darwins Beispiel, um eine Version zu bekommen.

Hinweis in seiner Version Die Hauptkomponente hat $ router.config in den Laufblock übergeben und identifiziert Kinder mit 3 Punkten.

.run(function($router) { 
    $router.config([ 
    { path: '/...', name: 'App', component: 'app', useAsDefault: true } 
    ]); 

Ich benutze angular 1.5.0, um seinem GitHub zu folgen. Ich stieß auf Probleme mit der Veröffentlichung einiger der Release-Kandidaten.

+0

Ich fand das auf 0.1. Ich glaube, dass sie 0,3 veröffentlichen. – Winnemucca

Verwandte Themen