标签：style blog http color java 使用 os io
[来自： Backbone.js 开发秘笈 第6章]
Template 用法：
通过 Underscore.js 提供的 _.template() 方法，我们可使用 <% ... %> 包含js代码；使用 <%= ... %> 输出变量值；使用 <%- ... %>输出转义后的变量值。
(function ($) { //define ------------------------- var UserModel = Backbone.Model.extend(); var UserCollection = Backbone.Collection.extend({ model: UserModel }); var UsersView = Backbone.View.extend({ tagName: ‘ul‘, //用默认 Underscore 的 _.template() 方法定义模板 template: _.template("<% _.each(users,function(user){%>" + "<li><a hre=‘javascript:;‘ data-id=‘<%= user.id %>‘><%= user.name %></a></li>" + "<%}); %>"), render: function () { //调用模板对象获取生成的 HTML $(this.el).html(this.template({ users: this.collection.toJSON() })); return this; } }); //instance ----------------------------- var usersView = new UsersView({ collection: new UserCollection([ { id: 1, name: ‘yoyo‘ }, { id: 7, name: ‘ronaldo‘ }, { id: 4, name: ‘ramos‘ } ]) }); //apply ------------------------------- $(function () { $(‘body‘).html(usersView.render().el); }); })(jQuery);
1. 模板加载器
模板元素：<script type="text/template" id="userTemplate">...</script>
(function ($, win, undefined) { $(function () { //define ------------------------------------------------------- var $templates = {}; $("script[type=‘text/template‘]").each(function () { $templates[$(this).attr(‘id‘)] = _.template($(this).html()); $(this).remove(); }); $.tempates = $.tempates || $templates; //apply --------------------------------------------------------- $(‘body‘).html("<ul>" + $.tempates.userTemplate({ id: 1, name: ‘yoyo‘ }) + "</ul>"); }); })(jQuery, window);
2014/08/11 – Backbonejs,布布扣,bubuko.com
标签：style blog http color java 使用 os io
原文地址：http://www.cnblogs.com/yoyoone23/p/3905126.html
