2013-07-08 33 views
0

在Handlebars.js - 模板中我得到一个senario来检查数组的值,如果值不等于做一个任务,等于做一个德..我喜欢这个,但它抛出一个错误,如何处理这种情况..任何一个帮助我?Handlebars.js - 如何选择“注销”值并追加到“div”元素

或者任何人都可以正确处理这个问题。

myJson是:

{ 
     "links":[{"label":"x","link":"x"}, 
    {"label":"y","link":"y"}, 
    {"label":"Logout","link":"Logout"}] 
} 


{{#each links}} 
        {{#if !lable.Logout}} 
        <li> 
         <a href="{{link}}">{{label}}</a> 
         {{#if subLinks}} 
          <ul> 
           {{#each subLinks}} 
            <li><a href="{{link}}">{{label}}</a></li> 
           {{/each}} 
          </ul> 
{{else}} 

<div><a href="{{link}}">{{label}}</a></div> 


        {{/if}} 
      {{/each}} 

回答

1

把手不能单独处理有条件的if语句,你需要使用一个辅助功能。

<div id="myDiv"></div> 

<script type="text/x-handlebars-template" id="handlebar"> 
{{#each links}} 
    {{#ifCond label "Logout" }} 
    <li> 
     <a href="{{link}}">{{label}}</a> 
     {{#if subLinks}} 
      <ul> 
       {{#each subLinks}} 
        <li><a href="{{link}}">{{label}}</a></li> 
       {{/each}} 
      </ul> 
     {{/if}} 
    {{else}} 
     <div> 
      <a href="{{link}}">{{label}}</a> 
     </div> 
    {{/ifCond}} 
{{/each}} 
</script> 

<script> 
    $(document).ready(function() { 
     var source = $("#handlebar").html(); 
     var template = Handlebars.compile(source); 
     var context = { 
      "links":[ 
       {"label":"x","link":"x"}, 
       {"label":"y","link":"y"}, 
       {"label":"Logout","link":"Logout"} 
      ] 
     }; 
     var html = template(context); 
     $("#myDiv").html(html); 
    }); 

    Handlebars.registerHelper('ifCond', function(v1, v2, options) { 
     if(v1 === v2) { 
     return options.fn(this); 
     } 
     return options.inverse(this); 
    }); 
</script>