Skip to content

Instantly share code, notes, and snippets.

@hanssens

hanssens/app.html

Last active January 25, 2018 10:56
Show Gist options
  • Save hanssens/6d5acdef6106689c9df0f53a8f663177 to your computer and use it in GitHub Desktop.
Save hanssens/6d5acdef6106689c9df0f53a8f663177 to your computer and use it in GitHub Desktop.
Download ZIP
Aurelia Gist - EnforceLowerCaseUrls
Raw
app.html
<template>
<router-view></router-view>
</template>
Raw
app.js
import { NavigationInstruction, Next, activationStrategy } from 'aurelia-router';
import { Redirect } from 'aurelia-router';
export class App {
router;
configureRouter(config, router) {
config.title = 'Aurelia Gist - EnforceLowerCaseUrls';
config.addPreActivateStep(EnforceLowerCaseUrls);
config.map([
{ route: '/', name: 'home', moduleId: 'home' },
{ route: ':company/:orderid', name: 'order', moduleId: 'order', nav: false, title: 'Orders' }
]);
this.router = router;
}
}
export class EnforceLowerCaseUrls {
run(nav, next) {
if (/[A-Z]/.test(nav.fragment)) {
return next.cancel(new Redirect(nav.fragment.toLowerCase()));
} else {
return next();
}
}
}
Raw
home.html
<template>
<h3>Home</h3>
<a route-href="route: order; params.bind: { company: 'ACME', orderid: 'ABC-123' }" role="button">Link with UPPERCASE params</a>
<hr>
</template>
Raw
home.js
export class Home {
}
Raw
index.html
<!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://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/config.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script>
<script>
require(['aurelia-bootstrapper']);
</script>
</body>
</html>
Raw
order.html
<template>
<h3>Order</h3>
<a route-href="route: home" role="button">Back home</a>
<hr>
Company: ${company}<br>
OrderID: ${orderId}<br><br>
Note: expecting both params as well as url to be lowercased (cannot test the latter through gist.run)
</template>
Raw
order.js
export class Order {
activate(params, routeConfig) {
this.company = params.company;
this.orderId = params.orderid;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment