使用 Meteor 时如何正确设置嵌套 #each 空格键迭代器的范围？

Posted 2023-03-08

【中文标题】使用 Meteor 时如何正确设置嵌套 #each 空格键迭代器的范围？

【英文标题】：How Do I Properly Scope Nested #each Spacebars Iterators When Using Meteor?

【发布时间】：2015-07-06 04:32:47

【问题描述】：

我有这些嵌套迭代器：

<ul class='detailViewList'>
    #each detailsCollection
    <li id=_id class='detailViewEntry checkboxStatus'>
        <input type="checkbox" class='detailCheckbox'>
        <b>detail</b>
        <div class="btn btn-xs btn-danger" id="delete-detail">x</div>
        <form class='form-inline'>
            <div class="form-group">
                <input type="text" id='_id' name='message' class="form-control" placeholder="message">
            </div>
        </form>
        #each messagesCollection
            #if isMessageForThisDetail
                message.message
            /if
        /each
    </li>
    /each
</ul>

我知道我可以通过把手路径从子模板访问父属性，从docs:

./name 或 this/name 或 this.name

但是我需要我的助手isMessageForThisDetail 来比较当前迭代的messageCollection 的属性与当前迭代的父detailsCollection。我的助手看起来像这样：

isMessageForThisDetail: function()
    var message = messagesCollection.findOne(detailId: this._id);
    if(message != undefined)
        return this._id == message._id;
     else 
        console.log('there is no message for this detail');
    

但this._id 的上下文是消息，而不是我想要比较消息字段的详细信息的_id。

【参考方案1】：

您应该可以像这样访问parent data：

isMessageForThisDetail: function() 
    var detailId = Template.parentData(1)._id;
    var message = messagesCollection.findOne(detailId: detailId);
    if(message)
      return this._id === message._id;
    else
      console.log('there is no message for this detail');

【参考方案2】：

我陷入了类似的困境，发现 Template.parentData() 方法目前在事件处理程序中不起作用（请参阅https://github.com/meteor/meteor/issues/5491）。用户 Lirbank 发布了这个简单的解决方法：

将数据从外部上下文传递到内部上下文中的 html 元素，在同一个模板中：

#each companies
  #each employees
    <a href="" companyId="../id">Do something</a>
  /each
/each

现在可以通过事件处理程序访问公司 ID，例如

$(event.currentTarget).attr('companyId')

【参考方案3】：

（未验证）

选项 1：

模板

#each companies
  #each employee this
    <a href="">this</a>
  /each
/each

帮手

var templateHelpers = 
    companies: function () 
    // array of companies
        return arrayOfCompanies;
    ,
    employee: function (company) 
        var companyId = company.id;
         // do something with companyId
    

选项 2：

模板

#each companies
  #each employee this.id
    <a href="">this</a>
  /each
/each

帮手

var templateHelpers = 
    companies: function () 
    // array of companies
        return arrayOfCompanies;
    ,
    employee: function (companyId) 
         // do something with companyId