Skip to content

Instantly share code, notes, and snippets.

@johnlindquist

johnlindquist/index.html

Created May 26, 2015 12:19
Show Gist options
  • Save johnlindquist/d8575f366b13569bc5ae to your computer and use it in GitHub Desktop.
Save johnlindquist/d8575f366b13569bc5ae to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!doctype html>
<html lang="en" ng-app="workshop">
<head>
<meta charset="UTF-8">
<title>AngularJS Jumpstart</title>
<link rel="stylesheet" href="bootstrap.min.css"/>
<script src="angular.js"></script>
<script src="workshop.js"></script>
</head>
<body>
<workshop duration="10">
<h1>AngularJS Jumpstart</h1>
</workshop>
<hr/>
<workshop duration="1">
<h1>React Jumpstart</h1>
</workshop>
<hr/>
<workshop duration="4">
<h1>Design Jumpstart</h1>
</workshop>
</body>
</html>
Raw
workshop.html
<div>
<ng-transclude></ng-transclude>
<h2>{{workshop.welcomeMessage}}</h2>
</div>
Raw
workshop.js
angular.module("workshop", [])
.directive("workshop", function () {
return {
templateUrl: "workshop.html",
controller: "WorkshopController as workshop",
transclude: true,
bindToController: true,
scope: {
duration: "@"
}
}
})
.controller("WorkshopController", function () {
var workshop = this;
workshop.welcomeMessage =
"Hi there, I hope you're ready for "
+ workshop.duration + " hours of class!";
workshop.onClick = function onClick(){
alert(workshop.welcomeMessage);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment