【问题标题】:How do I make {{#each}} work with these templates?如何让 {{#each}} 使用这些模板?
【发布时间】:2015-01-09 00:02:21
【问题描述】:

我一直在阅读有关空格键的这些教程。

Understanding Spacebars by David Burles

Meteor's Spacebars README on Github

Discover Meteor's Spacebars secrets

我觉得我可以理解得很好,但是我遇到了这个问题

我有这样的 ma​​in.html 模板

<template name="main">
  <div class="container">   
<section id="bl-work-section">
    <div class="bl-box">
          <h4 class="sin">Próximo</h4>
          <h2  id="titulo1" class="sin"></h2>
          <h4 class="sin" id="sub1"></h4>
    </div>
        <div class="bl-content">
            <h2>Lunes 25 de Noviembre del 2014</h2> 

            {{#each mostrarLunes}}
            {{> Lunes}}
            {{/each}}
    <a></a>
    </div>    
        <span class="bl-icon bl-icon-close"></span>
</section>

<!-- Panel items for the works -->  
   <div class="bl-panel-items" id="bl-panel-work-items">
       {{#each mostrarLunes}}
            {{showPromos}}
       {{/each}}
    </div>                
        </div>
        </div><!-- /container -->       
</template>

所以就像你们看到我在主模板中调用 2 个模板,而 2 个模板看起来像这样

Lunes.html 模板

<template name="Lunes">
  <ul id="bl-work-items">           
               <li data-panel="panel">        
              <div class="oferta">
            <a href="#"> <h3>Promocion: {{metadata.nombrePromo}} </h3><br><small>Descripcion:{{metadata.descripcionPromo}}</small></a>
        </div></li><br><br> 
                        </ul>    
</template>

showPromos.html 模板

<template name="showPromos">
  <div data-panel="panel">          
    <div>
              <h1>Estoy viendo esto en la segunda pagina </h1>
                            <h3>Nombre Promo {{metadata.nombrePromo}}</h3>
                            <p>Descripcion promo.{{metadata.descripcionPromo}}</p>
                        </div>               
                    </div>          
                    <nav>
                        <span class="bl-icon bl-icon-close"></span>
                    </nav>       
</template>

那么问题是什么?好吧,如果我们查看模板 LunesshowPromos,我有一个 Data-Panel="panel",但它看起来像那个数据面板当我将该值包装在 {{each}} 标记上时不起作用,因为如果我使用,则 {{each}} 标记在 data 之外-面板选择器它可以工作,所以它似乎不工作似乎他们没有连接。

所以我问是否有办法连接该值?已经尝试了第三个链接所说的辅助属性,但不起作用,属性辅助看起来像这样

Template.main.helpers({
  attributes: function () {
    return { 
      dataPanel: "prueba",
    }
  }
});

助手大多数人

Template.main.helpers({
  'mostrarLunes' : function(){
    return Promociones.find({'metadata.diaOferta' : { $in: ['Lunes'] } });
  }
});

【问题讨论】:

  • mostrarLunes 是否有元数据对象。你能不能也展示一下 mostrarLunes 的助手
  • 完成了,它适合你吗?
  • 这可能只是一个错字,但你需要一个&gt; 来调用你的子模板 showPromos - 它应该是{{&gt; showPromos}} 而不是{{showPromos}},它将寻找数据上下文/帮助函数一个模板。
  • Sup richie nice eye,这是一个问题,但不是主要问题,这里最大的问题是我想关联the data-panel="panel",以某种方式使该值在每个模板和不同模板之间兼容,以某种方式将它们关联起来,我想删除那个“面板”静态值
  • 你能把你的问题发到meteorpad.com吗?

标签: javascript css templates meteor spacebars


【解决方案1】:

似乎未设置数据上下文。尝试使用数据为您的其他模板创建一个模板助手(我不懂西班牙语,所以我假设这是您需要的 MongoDB 游标...

Templates.lunes.helpers({
  data: function() {
    return Promociones.find({'metadata.diaOferta' : { $in: ['Lunes'] } });
  }
});

Templates.showPromos.helpers({
  data: function() {
    return Promociones.find({'metadata.diaOferta' : { $in: ['Lunes'] } });
  }
});

【讨论】:

    猜你喜欢
    • 2016-10-31
    • 1970-01-01
    • 1970-01-01
    • 2011-12-17
    • 1970-01-01
    • 2011-05-30
    • 2015-01-26
    • 1970-01-01
    • 2015-08-07
    相关资源
    最近更新 更多