Skip to content

Instantly share code, notes, and snippets.

@morrissinger

morrissinger/application-controller.js

Created June 3, 2015 00:46
Show Gist options
  • Save morrissinger/a45ceb74ab078c0b14cf to your computer and use it in GitHub Desktop.
Save morrissinger/a45ceb74ab078c0b14cf to your computer and use it in GitHub Desktop.
Download ZIP
Angular 1 with ECMAScript 6, JSPM, and SystemJS
Raw
application-controller.js
export class ApplicationController {
constructor() {
this.foo = 'bar';
}
}
Raw
application-module.js
import 'angular-ui-router';
import { ApplicationController } from './controllers/application-controller';
import tpl from 'modules/application/templates/application-template.html!'
angular.module('Application', ['ui.router'])
.config(($stateProvider) => {
$stateProvider.state('home', {
url: '/home',
views: {
application: {
template: tpl,
controller: ApplicationController,
controllerAs: 'controller'
}
}
});
})
.controller('ApplicationController', ApplicationController);
Raw
application-template.html
Hello, {{controller.foo}}!
Raw
html.js
export function instantiate(load) {
return load.source;
}
Raw
index.html
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles/styles.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<ui-view name="application"></ui-view>
<script src="jspm_packages/system.js"></script>
<script src="config.js"></script>
<script>
System.config({
"paths": {
"*": "dist/*.js"
}
});
</script>
<script>
System.import('index');
</script>
</body>
</html>
Raw
index.js
import angular from 'angular';
import 'modules/application/application-module';
angular.element(document).ready(function() {
angular.bootstrap(document, ['Application']);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment