實施條件

Question

到目前爲止mustache是偉大的，但邏輯少現在似乎並沒有成爲一個功能。假設，我必須呈現模板，其中可以包含用戶的電子郵件和名稱。

如果電子郵件和名字都存在我希望我的渲染結果是：

<a href="mailto:EMAIL">NAME</a> 

如果電子郵件是存在的，但沒有名字，結果將是：

<a href="mailto:EMAIL">EMAIL</a> 

如果只是名稱模板應呈現爲：

NAME 

所以現在我必須做類似：

{{#email}}<a href="mailto:{{email}}">{{#name}}{{name}}{{/name}}{{^name}}{{email}}{{/name}}</a>{{/email}}{{^email}}{{name}}{{/email}} 

這真是太醜了！而這只是3個條件！如果我需要更多？我覺得在mustache中應該有另外一種方法。或者不應該？

所以，小鬍子開發者認爲是邏輯少是好事，但我有一個說法。大多數情況下，我們需要檢查模板中的某個變量（大多數時候我們只需要檢查是否存在）。所以我會做這樣的事情：

{% if email %}{{ email }}{% else %}{{ name }}{% endif %} 

，這看起來更全面然後

{{#email}}{{email}}{{/email}}{{^email}}{{name}}{{/email}} 

不是嗎？

如果我需要檢查name太：

{% if email %}{{email}}{% elif name %}{{name}}{% else %}Anonymous{% endif %} 

VS

{{#email}}{{email}}{{/email}}{{^email}}{{#name}}{{name}}{{/name}}{{^name}}Anonymous{{/name}}{{/email}} 

如果沒有，你會建議其他模板庫中javascript渲染模板？與jQuery（jQuery插件）集成是一個優勢，但不是要求 - 我可以自己做。

謝謝。

Answer 1

總是有Handlebars這是比香草小鬍子（這是鬍鬚的超集）多一點功能，當然，您可以使用任何其他無數的JS模板引擎。如果你把手去，你甚至可以重新實現一個版本，接受多個參數，像這樣的{{#if}}塊幫手（警告：非常輕微的測試，寫作大多是出於我的頭頂部）

Handlebars.registerHelper('if', function() { 
    var args = Array.prototype.slice.call(arguments), 
     options = args.splice(-1, 1)[0], 
     allPass = true, 
     context; 

    for (var i = 0; i < args.length; i++) { 
     context = args[i]; 

     if(Object.prototype.toString.call(context) === "[object Function]") { 
      context = context.call(this); 
     } 

     if (!context || Handlebars.Utils.isEmpty(context)) { 
      allPass = false; 
      break; 
     } 
    } 

    if(allPass) { 
     return options.fn(this); 
    } else { 
     return options.inverse(this); 
    } 
}); 

，並用它像這樣：

var template = "{{#if a b c}}pass{{else}}fail{{/if}}"; 
var c = Handlebars.compile(template); 
console.log(c({a: true, b: pass, c: true})) 

請注意，這可以被認爲是「作弊」的純粹主義者，你正在實現某種混合邏輯運算符，更使其接受則params的不確定量。 Mustache的要點是要有一個非常簡單的spec，它可以輕鬆移植到各種編程語言中，以便可以在後端和前端交換重用您的模板。