-
-
Save jsobell/396b83429e193de9376fa7c9a83b01aa to your computer and use it in GitHub Desktop.
Aurelia view port
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<template> | |
<h1>${message}</h1> | |
<button click.delegate="go()">go to second</button> | |
<div> | |
[[DEFAULT: <router-view name="primary"></router-view>]] | |
</div> | |
<div> | |
[[SECONDARY:<router-view name="secondary"></router-view>]] | |
</div> | |
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export class App { | |
message = 'Hello World'; | |
router; | |
configureRouter(config, router) { | |
this.router = router; | |
config.map( | |
[ | |
{ route: ["", "home"], viewPorts: { "primary": { moduleId: "./home"}, "secondary": { moduleId: "./empty" } }, title: "home" }, | |
{ route: "second-route", name: "second", viewPorts: { "primary": { moduleId: "./home"}, "secondary": { moduleId: "./second" } }, title: "Second" }, | |
]); | |
} | |
go() { | |
this.router.navigateToRoute("second") | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {inlineView} from "aurelia-framework"; | |
@inlineView(` | |
<template> | |
</template> | |
`) | |
export class Empty {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {inlineView} from "aurelia-framework"; | |
@inlineView(` | |
<template> | |
<h1>Home view</h1> | |
</template> | |
`) | |
export class Home {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<title>Aurelia</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
</head> | |
<body aurelia-app> | |
<h1>Loading...</h1> | |
<script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/jspm_packages/system.js"></script> | |
<script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/config.js"></script> | |
<script> | |
System.import('aurelia-bootstrapper'); | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {inlineView} from "aurelia-framework"; | |
@inlineView(` | |
<template> | |
<h1>Second view</h1> | |
</template> | |
`) | |
export class Second {} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment