Last active
November 19, 2016 11:40
-
-
Save xenod/c310a1b0f6df0e1cc90917999d06463f to your computer and use it in GitHub Desktop.
Grid: editing custom editor
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> | |
<require from="aurelia-kendoui-bridge/button/button"></require> | |
<require from="aurelia-kendoui-bridge/datetimepicker/datetimepicker"></require> | |
<require from="aurelia-kendoui-bridge/scheduler/scheduler"></require> | |
<require from="aurelia-kendoui-bridge/grid/grid"></require> | |
<require from="aurelia-kendoui-bridge/grid/col"></require> | |
<require from="aurelia-kendoui-bridge/common/template"></require> | |
<require from="aurelia-kendoui-bridge/splitter/splitter"></require> | |
<require from="aurelia-kendoui-bridge/tooltip/tooltip"></require> | |
<require from="./my-element"></require> | |
<div id="example"> | |
<button click.delegate="setVariableFromHost()">Set variable from host</button> | |
<my-element test-variable.bind="hostsVariable"></my-element> | |
</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 { | |
hostsVariable: string = 'hi'; | |
setVariableFromHost() | |
{ | |
console.log('setVariableFromHost called'); | |
this.hostsVariable = 'parent'; | |
} | |
} |
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 KendoUI bridge</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.2.714/styles/kendo.common.min.css"> | |
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.2.714/styles/kendo.rtl.min.css"> | |
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.2.714/styles/kendo.default.min.css"> | |
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.2.714/styles/kendo.mobile.all.min.css"> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.4.0/bluebird.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/1.2.1/chroma.min.js"></script> | |
<script src="https://kendo.cdn.telerik.com/2016.2.714/js/jquery.min.js"></script> | |
<script src="https://kendo.cdn.telerik.com/2016.2.714/js/jszip.min.js"></script> | |
<script src="https://kendo.cdn.telerik.com/2016.2.714/js/kendo.all.min.js"></script> | |
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> | |
</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-kendoui-bundles/1.0.0-beta.1.0.6/config2.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
export function configure(aurelia) { | |
aurelia.use | |
.standardConfiguration() | |
.developmentLogging() | |
.plugin('aurelia-kendoui-bridge'); | |
aurelia.start().then(a => a.setRoot()); | |
} |
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> | |
<div style="background-color: lightblue"> | |
<button click.delegate="setVariableFromCustomElement()">Set variable from CustomElement</button> | |
<h1>Value of testVariable: ${testVariable}</h1> | |
</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
import { bindable } from 'aurelia-framework'; | |
export class MyElementCustomElement { | |
@bindable testVariable; | |
setVariableFromCustomElement() { | |
console.log('setVariableFromCustomElement called'); | |
this.testVariable = 'customElement2'; | |
} | |
testVariableChanged(newValue) { | |
console.log('testVariable Changed, new value:'); | |
console.log(newValue); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment