Skip to content

Instantly share code, notes, and snippets.

@davismj
Created March 13, 2019 22:58
Show Gist options
  • Save davismj/030ad4fdf391a2b85aa1f1b6bee072a1 to your computer and use it in GitHub Desktop.
Save davismj/030ad4fdf391a2b85aa1f1b6bee072a1 to your computer and use it in GitHub Desktop.
Compose Deactivation
<template>
<p>a</p>
<a href="#b">b</a>
<compose view-model="comp"></compose>
</template>
export class AViewModel {
}
<template>
<router-view></router-view>
</template>
export class App {
couldDeactivate = false;
deactivated = false;
canDeactivate() {
const vm = this.compose.currentViewModel;
return Promise.resolve((vm && vm.canDeactivate) ? vm.canDeactivate() : true)
.then((could) => this.couldDeactivate = !!could);
}
deactivate() {
const vm = this.compose.currentViewModel;
return Promise.resolve((vm && vm.deactivate) ? vm.deactivate() : null)
.then(() => this.deactivated = true);
}
configureRouter(config, router) {
this.router = router;
config.map([
{ route: ['a', ''], moduleId: 'a' },
{ route: 'b', moduleId: 'b' }
]);
}
}
<template>
<p>b</p>
<a href="#a">a</a>
</template>
export class BViewModel {
}
<template>
composed
</template>
export class ComposedViewModel {
canDeactivate() {
return this.checkIfSaved() || confirm('unsaved changes bro')
}
deactivate() {
return this.save();
}
checkIfSaved() {
return false
}
save() {
return new Promise(resolve => setTimeout(resolve, 2000));
}
}
<!doctype html>
<html>
<head>
<title>Table Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body aurelia-app="main">
<h1>Loading...</h1>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.6/system.js"></script>
<script src="https://rawgit.com/aurelia-ui-toolkits/aurelia-materialize-bundles/0.30.0/config2.js"></script>
<script>
System.import('aurelia-bootstrapper');
</script>
</body>
</html>
/*******************************************************************************
* The following two lines enable async/await without using babel's
* "runtime" transformer. Uncomment the lines if you intend to use async/await.
*
* More info here: https://github.com/jdanyow/aurelia-plunker/issues/2
*/
//import regeneratorRuntime from 'babel-runtime/regenerator';
//window.regeneratorRuntime = regeneratorRuntime;
/******************************************************************************/
import 'materialize';
export function configure(aurelia) {
aurelia.use
.standardConfiguration()
.developmentLogging()
.plugin('aurelia-materialize-bridge', bridge => bridge.useAll() );
aurelia.start().then(a => a.setRoot());
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment