Wie benutzt man Layouts in Aurelia?

Question

Aurelia hat vor kurzem Unterstützung für Layouts hinzugefügt, und sie haben diese in their documentation grob erklärt.

Obwohl ich es geschafft habe, das Layout selbst zu funktionieren, kann ich keine Variablen in meinem Layout-HTML verwenden, die ich als Eigenschaften in meinem Layout-ViewModel habe.

A MWE:

app.ts

import {Router, RouterConfiguration} from 'aurelia-router'; 

export class App { 
    router: Router; 

    configureRouter(config: RouterConfiguration, router: Router) { 
    config.map([ 
     { route: 'hello', layoutViewModel: 'layout/main', moduleId: 'hello/index' }, 
    ]); 
    } 
} 

layout/main.ts

export class MainLayout { 
    heading = 'Hallo Welt'; 
} 

layout/main.html

<template> 
    <h1>${heading}!</h1> 
</template 

Aber nur das Ausrufezeichen tritt auf. Hast du irgendwelche Ideen, was ich falsch mache oder wie ich es zur Arbeit bringen kann?

Vielen Dank im Voraus!

Answer 1

Sorry für die verzögerte Antwort hier, aber Ihr Beispiel scheint für mich zu arbeiten. Es ist sehr wahrscheinlich, dass Sie einen Fehler festgestellt haben, der inzwischen behoben wurde, oder ein Problem an anderer Stelle in Ihrem Code.

Bitte sehen Sie this linked Gist.run example, um Ihr laufendes Beispiel zu sehen.

Answer 2

Es gibt ein Problem auf Github über sehr gleiche Problem https://github.com/aurelia/templating-router/issues/34 Es behoben wurde und jetzt layoutViewModel bindet gut.