handlebar js其他的自定義幫手如果

Question

我已經開始使用Handlebars.js。看起來，如果沒有其他內置的條件。 我想擁有類似的東西

{{#if type.one }} 
    do something ... IF 
{{else if type.two}} 
    do something ... ELSE IF 
{{else}} 
    do something ... ELSE 
{{/if}} 

但是，這是行不通的。如何使用車把來如何操作？寫一個自定義幫手是唯一的選擇？如果是，那麼請提供一些指導來寫這個幫手。

Answer 1

從Handlebars 3.0開始，OP描述的語法確實可以開箱即用！請參閱：https://github.com/wycats/handlebars.js/pull/892瞭解更多信息。

注意： 對於Ember，從版本1.10開始，這也起作用。另請參見： http://emberjs.com/blog/2015/02/07/ember-1-10-0-released.html#toc_chained-else-blocks

Answer 2

您無法使用Handlebars的自定義幫助程序進行此操作if-ish助手只能理解兩部分：「if」部分和「else」部分。你可以嵌套的東西，但：

{{#if type.one}} 
    do something ... IF 
{{else}} 
    {{#if type.two}} 
     do something ... ELSE IF 
    {{else}} 
     {{#if type.three}} 
      ... 
     {{else}} 
      ... 
     {{/if}} 
    {{/if}} 
{{/if}} 

這種事情會得到討厭快，所以你可能不想這樣做。一個更好的方法（像Handlebars一樣）將邏輯推入JavaScript，以便最多隻有一個type.one,type.two，type.three，......將是真實的;然後你可以：

{{#if type.one}} 
    ... 
{{/if}} 
{{#if type.two}} 
    ... 
{{/if}} 
{{#if type.three}} 
    ... 
{{/if}} 

如果你有很多的type或者如果你{{#if}} S中體選項是複雜的，你可以切換到諧音。您必須添加一個自定義幫助器才能根據模板變量構建部分名稱;是這樣的：

Handlebars.registerHelper('show_type', function(type) { 
    var types = ['one', 'two', 'three']; 
    var partial; 
    for(var i = 0; i < types.length; ++i) { 
     if(!type[types[i]]) 
      continue; 
     partial = '_partial_' + types[i]; 
     break; 
    } 
    if(partial) 
     return Handlebars.partials[name](this); 
    else 
     return ''; 
}); 

然後，假設你的諧音都被註冊，並統一進行命名，你可以說：

{{show_type type}} 

Answer 3

你可以這樣做：

{{#if type.one}} 
    ... 
{{else}} {{#if type.two}} 
    ... 
{{else}} {{#if type.three}} 
    ... 
{{else}} 
    ... 
{{/if}}{{/if}}{{/if}} 

Answer 4

確切語法OP已寫入的文件將在Ember Canary中運行，並啓用 ember-htmlbars-inline-if-helper功能標誌。

Answer 5

如果你想換的行爲，你可能會感興趣的Dan Harper's helpers，你就可以這樣做：

{{#is type 1}} 
    <p>Do something when 1.</p> 
{{else}}{{#is type 2}} 
    <p>Do something when 2.</p> 
{{else}}{{#is type 3}} 
    <p>Do something when 3.</p> 
{{/is}}{{/is}}{{/is}} 

這裏是jsfiddle。

Answer 6

可以使用

{{#if isAtWork}} 
    Ship that code! 
{{else if isReading}} 
     You can finish War and Peace eventually... 
{{/if}} 

鏈接：http://guides.emberjs.com/v1.12.0/templates/conditionals/