Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta name="" content="" />
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<div id='out'></div>
<script id="app-template" type="text/stache">
{{#eq page 'home'}}
  <home-page/>
{{else}}
  <h2>Away</h2>
  <a href="{{routeUrl page='home'}}">
    Home
  </a>
{{/eq}}
</script>
  
<script id="home-template" type="text/stache">
<h1>Home Page</h1>
<a href="{{routeUrl page='away'}}">
  Away
</a>
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.js"></script>
<script src="//canjs.com/release/latest/can.jquery.js"></script>
<script src="//canjs.com/release/latest/can.construct.super.js"></script>
<script src="//canjs.com/release/latest/can.map.define.js"></script>
<script src="//canjs.com/release/latest/can.stache.js"></script>
<script src="//canjs.com/release/latest/can.fixture.js"></script>
</body>
</html>
 
can.Component.extend({
  tag: "home-page",
  template: can.view('home-template')
});
can.route(":page",{page: "home"})
can.route.ready();
$("body").prepend(
  can.view("app-template",can.route) 
);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
justinbmeyerpro
0viewers