Skip to content

Instantly share code, notes, and snippets.

@euglv
Forked from jdanyow/app.html
Last active November 22, 2024 12:53
Show Gist options
  • Save euglv/6a2ce66ed37b552dcfd2614d76cbe8fa to your computer and use it in GitHub Desktop.
Save euglv/6a2ce66ed37b552dcfd2614d76cbe8fa to your computer and use it in GitHub Desktop.
Aurelia Gist
<template>
<h1 red-box>${message}</h1>
</template>
import { inject, templateController, createOverrideContext, BoundViewFactory, ViewSlot } from 'aurelia-framework';
export class App {
message = 'Hello World!';
}
@templateController
@inject(BoundViewFactory, ViewSlot, Element)
export class RedBoxCustomAttribute {
constructor(factory, slot, element) {
this.factory = factory;
this.slot = slot;
this.element = element;
console.log(element)
}
bind(bindingContext, overrideContext) {
let newContext = { };
overrideContext = createOverrideContext(newContext, overrideContext);
if (!this.view) {
this.view = this.factory.create();
this.view.bind(newContext, overrideContext);
this.slot.add(this.view);
} else {
this.view.bind(newContext, overrideContext);
}
}
}
<!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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment