Wie öffne ich mehrere Seiten in der gleichen App?

Question

Ich weiß, dass Aurelia ein Framework für ein SPA ist, aber ich muss mehrere Seiten gleichzeitig im Browser öffnen.

Ich möchte jede Seite (view/viewmodel) innerhalb einer ziehbaren div hosten und mehr als eine gleichzeitig geöffnet haben. Sie werden vom Benutzer aus einem Menü ausgewählt.

Ich habe ViewPorts angeschaut, kann aber nicht sehen, wie sie bei diesem Problem helfen.

Gibt es eine andere Möglichkeit, dies zu tun?

Answer 1

Ja, es gibt einen Weg, dies zu tun.

Sie sagen Seiten, aber im Grunde sind sie Komponenten. Jede Komponente hat eine HTML- (Ansicht) und eine JS-Datei (Ansichtsmodell). Sie können als benutzerdefinierte Elemente eingefügt werden.

Wenn Sie also mehrere mögliche Komponenten auf einer Seite haben möchten, müssen Sie nur eine Komponente erstellen, die einen Platzhalter für diese Ansichten hat.

Wahrscheinlich würden Sie etwas suchen, wie diese wollen:

running Gist example

<template> 
    <require from="./page1"></require> 
    <require from="./page2"></require> 

    <page1></page1> 

    <hr> 

    <page2></page2> 
</template> 

Sie Schleife erstellen können für alle Elemente, die Sie anzeigen möchten, wenn Sie mehrere Instanzen derselben Seite benötigen, und setzen ein repeat.for auf den Elementen:

HTML:

<template> 
    <require from="./page1"></require> 
    <require from="./page2"></require> 

    <page1 repeat.for="i of page1instances"></page1> 

    <hr> 

    <page2 repeat.for="i of page2instances"></page2> 
</template> 

JS:

export class App { 
    const page1Instances = 4; 
} 

machen sie & abwerfbaren funktioniert wie jedes andere Element ziehen, gibt es viele Lösungen für die gefunden werden. Machen Sie einfach die <page1> und <page2> ziehbar.