下划线中的部分模板（就像在把手中）？ [英] Partials template in underscore (just like in handlebars)?

问题描述

  var PeopleModel = Backbone.Model.extend（{
 defaults： {
people：[
 {username：alan，firstName：Alan，lastName：Johnson，phone：1111，email ：[e-mail]}，
 {username：allison，姓氏：Allison，lastName：房子，电话：2222，email [e-mail]}，
 {username：ryan，firstName：Ryan，lastName：Carson，phone：3333，email [e-mail]}，
 {username：ed，firstName：Edward，lastName：Feild，phone：4444，email电子邮件地址：5555，电子邮件地址，电子邮件地址，电子邮件地址 [e-mail]}，
 {username：gerald，firstName：Gerald，lastName：管家，电话：6666，email [e-mail]} 
]，
company：{name：Random Corp.}，
country：Engl和

 
}）; 
  

以下是我的模板

 < script id =people-templatetype =text / x-handlebars-template> 
 {{＃每个人}} 
 {{> person}} 
 {{/ each}} 
< / script> 
 
< script id =person-partialtype =text / x-handlebars-template> 
< div class =person> 
< h2> {{fullName}}< / h2> 
< div class =phone> {{phone}}< / div> 
< div class =email>< a href =mailto：{{email}}> {{email}}< / a>< / div> 
< / div> 
  

这是我实现部分使用handlebars.js。

我的问题

1.我们有类似的东西，我的意思是underscore.js模板引擎的partials incase？

2.如果是这样，我们如何在underscore.js模板引擎中实现partial

解决方案

不，Underscore的模板中没有原生的部分支持。但是，您可以在<％...％> 中放入几乎所有的JavaScript。特别是，你可以调用你自己的函数，这样你就可以毫无困难地添加一些部分。你可以有这样的模板：

 < script id =people-templatetype =text / x-handlebars -template> 
<％_（people）.each（function（person）{％> 
<％= partial（'person'，person）％> 
<％}） ％GT; 
< / script> 
  

，然后将部分函数添加到 window ：

  window.partial = function（which，data）{
 var tmpl = $（'＃'+ which +'-partial'）。html（）; 
 return _.template（tmpl）（data）; 
}; 
  

演示： http://jsfiddle.net/ambiguous/HDuj5/9/

这并不像<$ code> {{> ...}} 在Handlebars中，但Underscore的模板是JavaScript本身的一个非常薄的包装，并且限制了你的一些。你可以使用命名空间来避免直接在窗口中放置东西，或者你可以使用 {variable：...} 选项添加到 _。template 和一个封装来设置您的标准帮手。

I have a backbone model like this

var PeopleModel = Backbone.Model.extend({
defaults: {              
    "people": [
          { "username": "alan", "firstName": "Alan", "lastName": "Johnson", "phone": "1111", "email": "[e-mail]" },
          { "username": "allison", firstName: "Allison", "lastName": "House", "phone": "2222", "email": "[e-mail]" },
          { "username": "ryan", "firstName": "Ryan", "lastName": "Carson", "phone": "3333", "email": "[e-mail]" },
          { "username": "ed", "firstName": "Edward", "lastName": "Feild", "phone": "4444", "email": "[e-mail]" },
          { "username": "phil", "firstName": "Philip", "lastName": "Doom", "phone": "5555", "email": "[e-mail]" },
          { "username": "gerald", "firstName": "Gerald", "lastName": "Butler", "phone": "6666", "email": "[e-mail]" }
    ],
    "company": {"name": "Random Corp."},
    "country": "England"
}

});

And below are my templates

<script id="people-template" type="text/x-handlebars-template">
{{#each people}}
  {{> person}}
{{/each}}
</script>

<script id="person-partial" type="text/x-handlebars-template">
 <div class="person">
    <h2>{{fullName}} </h2>
    <div class="phone">{{phone}}</div>
   <div class="email"><a href="mailto:{{email}}">{{email}}</a></div>    
 </div>

This is how I implemented partial using handlebars.js.

My questions

1.Do we have similar thing, I mean the partials incase of underscore.js template engine?

2.If so how do we implement partial in underscore.js template engine

解决方案

No, there is no native partial support in Underscore's templates. But, you can put pretty much any JavaScript you want inside <% ... %>; in particular, you can call your own functions so you can add something partial-ish without much difficulty. You could have a template like this:

<script id="people-template" type="text/x-handlebars-template">
    <% _(people).each(function(person) { %>
      <%= partial('person', person) %>
    <% }) %>
</script>

and then add a partial function to window:

window.partial = function(which, data) {
    var tmpl = $('#' + which + '-partial').html();
    return _.template(tmpl)(data);
};

Demo: http://jsfiddle.net/ambiguous/HDuj5/9/

That's not quite as slick and pretty as {{> ... }} in Handlebars but Underscore's templates are a very thin wrapper around JavaScript itself and that limits you somewhat. You can use namespaces to avoid putting things directly in window or you could use the {variable: ...} option to _.template and a wrapper to set up your standard helpers.

这篇关于下划线中的部分模板（就像在把手中）？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！