Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Ember Starting Point v1.0.0-rc.3" />
<meta charset=utf-8 />
<title>Ember Starting Point</title>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://builds.emberjs.com/handlebars-1.0.0-rc.3.js"></script>
  <script src="http://builds.emberjs.com/ember-1.0.0-rc.3.js"></script>
</head>
<body>
  <script type="text/x-handlebars" data-template-name="index">
  <h2>Index Content:</h2>
  <ul>
  {{#each item in content}}
      <li>{{item}}</li>
  {{/each}}
   </ul>
   
   {{view App.NavView}}
   {{view App.ExpTypesView}}
</script>
  
  
  
  <script type="text/x-handlebars" data-template-name="nav">
  <li>Navview</li>
  </script>
  
  <script type="text/x-handlebars" data-template-name="expTypes">
  <li>ExpTypesView</li>
  </script>
  
</body>
</html>
​
 
App = Ember.Application.create({});
​
App.IndexRoute = Ember.Route.extend({
  setupController: function(controller) {
    controller.set('content', ['a', 'b', 'c']);
  }
});
​
App.NavView = Em.View.extend({
  templateName: 'nav',
  tagName: 'ul',
  classNames: ['nav'],
  classNameBindings: ['type'],
  type: 'nav-tabs',
  currentPathDidChange: function(){
    Ember.run.next( this, function() {
      $("ul li:has(>a.active)").addClass('active');
      $("ul li:not(:has(>a.active))").removeClass('active');
   }); 
  }.observes('controller.currentPath')
});
​
App.ExpTypesView = App.NavView.extend({
  templateName: 'expTypes',
  type: 'nav-pills',
});
Output

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

Dismiss x
public
Bin info
anonymouspro
0viewers