To be or not to be.That is a question!

---源于莎士比亚的《哈姆雷特》

导航

Ember.js demo3 

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.js"></script>
  <script src="//ryanflorence.com/ember.min.js"></script>
<meta charset=utf-8 />
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
<title>JS Bin</title>
</head>
<body>
  
  <script type="text/x-handlebars">
    <ul class="nav well">
      {{#each model}}
        {{render "user" this}}
      {{/each}}
    </ul>
  </script>
  
  <script type="text/x-handlebars" id="user">
  <li>
    <p>
      <img {{bindAttr src="avatar"}}>
      <b>{{first}} {{last}}</b>
    </p>
  </li>
  </script>
  
  
</body>
</html>
var App = Ember.Application.create();

App.ApplicationRoute = Ember.Route.extend({
  model: function() {
    return users;
  }
});

var users = [
  {
    id: 1,
    first: 'Ryan',
    last: 'Florence',
    avatar: 'https://si0.twimg.com/profile_images/3123276865/5c069e64eb7f8e971d36a4540ed7cab2.jpeg'
  },
  {
    id: 2,
    first: 'Tom',
    last: 'Dale',
    avatar: 'https://si0.twimg.com/profile_images/1317834118/avatar.png'
  },
  {
    id: 3,
    first: 'Yehuda',
    last: 'Katz',
    avatar: 'https://si0.twimg.com/profile_images/3250074047/46d910af94e25187832cb4a3bc84b2b5.jpeg'
  }
];
img {
  width: 50px;
  margin-right: 10px;
}

 

posted on 2013-11-01 10:40  Ijavascript  阅读(234)  评论(0)  编辑  收藏  举报