Wie installiere/richte ich ein Aurelia router/routen

Ich möchte ein paar links oben auf meiner Seite, und wenn sie geklickt werden, werden verschiedene Ansichten dem Benutzer auf der gleichen Seite präsentiert. Ich möchte das von Grund auf einrichten.Wie installiere/richte ich ein Aurelia router/routen

Ich habe ein paar Beispiele online von dieser Arbeit gesehen, aber wenn ich es mit dem Arelia Todo Beispiel als Grundlinie (http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/quick-start) von Grund auf neu einrichten, scheint ich etwas zu verpassen. Ich nehme an, dass ich den Aurelia-Router installieren muss, aber es gibt keine Anweisung, dies zu tun (das kann ich finden). Die Lies mich auf der Github-Seite gibt keine Anweisungen, wie man es installiert.

Was ich weiß.

Ich werde eine app.js Datei benötigen, die die Routen und sieht ungefähr so hat:

export class App { 
    configureRouter(config, router) { 
    config.title = 'Aurelia'; 

    config.map([ 
     {route: ['','home'], name: 'home', moduleId: 'components/home/home', nav: true, title: 'Home'}, 
     {route: ['settings'], name: 'settings', moduleId: '/settings/settings', nav: true, title: 'Settings'} 
    ]); 


    this.router = router; 

    } 
}

Ich werde eine app.html Datei benötigen, die etwa wie folgt aussieht (das Schleifen durch die Objekte in der vorheriger Code und greift auf deren Eigenschaften zu).

<template> 
    <nav> 
    <ul> 
     <li repeat.for="row of router.navigation"> <!--Loop through routes--> 
     <a href.bind="row.href">${row.title}</a> 
     </li> 
    </ul> 
    </nav> 

    <router-view></router-view> 
    <hr> 

</template>

Die Ergebnisse sind eine leere Seite ohne Fehler. Jedes statische HTML, das ich in app.html platziere, rendert aber anders als das - nichts.

Quelle

2016-11-23 William

Sie müssen aurelia-Router nicht installieren, ist es bereits ist installiert mit dem Framework. Ihr Code sollte gut funktionieren ... Erhalten Sie eine Fehlermeldung? –

Abgesehen davon, dass Sie keine Array-Klammern um die '['Einstellungen']' brauchen, sieht Ihr Code gut aus. –

Das Ergebnis ist eine leere Seite ohne Fehler. Das einzige, was auf der Seite angezeigt wird, ist irgendein statisches HTML, das ich in app.html platziere – William

Wenn Sie aus dem Beispiel von der Website Aurelia im Anschluss an sind, dann werden Sie bemerkt haben, dass die main.js in ihrem Tutorial

export function configure(aurelia) { 
    aurelia.use.basicConfiguration(); 
    aurelia.start().then(() => aurelia.setRoot()); 
}

Ändern Sie diese zu

ist

export function configure(aurelia) { 
    aurelia.use.standardConfiguration(); 
    aurelia.start().then(() => aurelia.setRoot()); 
}

In meine erfahrung mit dem schnellen starter musste ich auch in die index.html die "aurelia-routing.min.js" einfügen. So sieht meine index.html wie:

<body aurelia-app="src/main"> 
    <script src="scripts/system.js"></script> 
    <script src="scripts/config-typescript.js"></script> 
    <script src="scripts/aurelia-core.min.js"></script> 
    <script src="scripts/aurelia-routing.min.js"></script> 
    <script> 
     System.import('aurelia-bootstrapper'); 
    </script> 
    </body>

Wenn aber Sie fangen mehr in Aurelia zu bekommen, schlage ich vor, mit denen Sie beginnen ihre next tutorial

Quelle

2016-12-21 02:15:43 paulb

Wie installiere/richte ich ein Aurelia router/routen

Antwort

Verwandte Themen