Question

我已将所有模板预编译成一个js文件并在页面中加载了js。

我有3个模板模板1 - a.handlebars

＆＃13;

<ul>
		{{#each this}}
			<li class="a">
				<a href="#">{{@key}}</a>
				{{> b}}
			</li>
		{{/each}}
	</ul>

＆＃13;

模板2 - b.handlebars

＆＃13;

 <ul>
   {{#each this}}
   <li class="b">
     <a href="#">{{@key}}</a>
     {{> c}}
   </li>
   {{/each}}
</ul>

＆＃13;

模板3 -c.handlebars

＆＃13;

 <ul>
   {{#each this}}
   <li class="c">
     <a href="#">{{ this }}</a>
   </li>
   {{/each}}
</ul>

＆＃13;

我有以下JS将数据加载到模板

＆＃13;

var menu= {
   a1:{
     b1:[c1, c2, c3],
     b2: [c4, c5, c6]
   },
   a2:{
     b3:[c7, c8],
     b4: [c9]
   }
 };

Handlebars.templates.a(menu);

＆＃13;

第一个模板（a.handlebars）加载a1和a2。但是当第一个模板加载部分b.handlebars时它就失败了。我试着写一个日志声明来看看我得到了什么＆＃34;这个＆＃34;。我有4个空格，它是字符串类型。

我不明白为什么b.handlebar在我以为我会得到一个字符串时（例如a1）

＆＃13;

{
    b1:[c1, c2, c3],
    b2: [c4, c5, c6]
}

＆＃13;

以前，我没有预先编制把手。我在我的html中使用了所有把手并使用Handlebars编译它。编译它工作正常。我不知道为什么代码在每次编译后都失败了。

非常感谢任何帮助。

我想把他作为我的最终结果：

＆＃13;

<ul>
   <li class="a"><a href="#">a1</a>
       <ul>
           <li class="b"><a href="#">b1</a>
             <ul>
               <li class="c"><a href="#">c1</a></li>
               <li class="c"><a href="#">c2</a></li>
               <li class="c"><a href="#">c3</a></li>
             </ul>
           </li>
           <li class="b"><a href="#">b2</a>
              <ul>
               <li class="c"><a href="#">c4</a></li>
               <li class="c"><a href="#">c5</a></li>
               <li class="c"><a href="#">c6</a></li>
             </ul>
           </li>
           <li class="b"><a href="#">b3</a></li>
       </ul>
  </li>
  <li class="a"><a href="#">a2</a>
       <ul>
           <li class="b"><a href="#">b3</a>
             <ul>
               <li class="c"><a href="#">c7</a></li>
               <li class="c"><a href="#">c8</a></li>
             </ul>
           </li>
           <li class="b"><a href="#">b4</a>
              <ul>
                <li class="c"><a href="#">c9</a></li>
             </ul>
           </li>
       </ul>
   </li>
 </ul>

＆＃13;

但我得到了这个。由于b.handlebars没有获取对象数据。

＆＃13;

<ul>
  <li class="a"><a href="#">a1</a>
    <ul>

    </ul>
  </li>
  <li class="a"><a href="#">a2</a>
    <ul>

    </ul>
  </li>
</ul>

＆＃13;

我为这篇冗长的帖子道歉。我一直试图找到一个解决方案。再一次，解决这个问题的任何帮助都会很棒。

感谢。

Answer 1

问题是由于使用grunt编译把手/模板文件引起的。

命令：＆＃34; grunt把手＆＃34;

一旦我使用处理程序编译文件，代码就开始工作了。

命令：handlebars template_files -f output_file

如果有人知道如何使用grunt命令使编译的代码工作，我肯定想知道。感谢。

把手 - 部分模板没有得到上下文

1 个答案: