0

我正在尝试使用 meteor-autoform 包生成看起来像这样的选项:

<div class="radio"> <label> <input type="radio" name="optionsRadios" id="optionsRadios1" class="px"> <span class="lbl"><strong>amazon.co.jp</strong></span><br> <span class="lbl">Ordered qty 1 on Oct 13, 2014 (4 days ago)</span><br> </label> </div>

但似乎我对 html 格式没有太多控制权。我是创建自己的自定义自动生成模板的唯一选择吗?我很难理解如何做到这一点。

我看过示例模板,但我几乎无法理解。在 bootstrap3-horizo​​ntal 模板中,我没有看到任何对“option”或“radio”的引用。因此,弄清楚如何为选项创建自定义模板并没有多大帮助。

非常感谢任何提示或示例!

编辑 我们在模板中使用这个生成选项:

 {{> afQuickField name='purchaseItemId' options=purchaseSelectOptions noselect=true template="bootstrap3-horizontal" label-class="col-sm-2" input-col-class="col-sm-10" class="form-control"}}

和js中的一个函数

purchaseSelectOptions: function() {
return _.chain(this.potentialPurchaseItems)
  .filter(function(potentialPurchaseItem) {
    return potentialPurchaseItem.totalQuantityReceived < potentialPurchaseItem.quantityPurchased;
  })
  .map(function(purchaseItem) {
    var vendor = Vendors.findOne({_id: purchaseItem.vendorId});
    var vendorName = vendor ? vendor.vendorName : 'loading...';
    return {
      label: vendorName + ' - waiting to receive ' + (purchaseItem.quantityPurchased - purchaseItem.totalQuantityReceived) + '. (Qty ' + purchaseItem.quantityPurchased + ' ordered ' + moment(purchaseItem.purchasedAt).format("MMM-DD-YYYY") +')',
      value: purchaseItem._id,
    };
  })
  .value();
},

因此,这不仅仅是单独设置元素样式的问题。我试图弄清楚如何修改自动模板或其他东西,以便我可以更好地控制结构和类。

4

1 回答 1

3

在另一个论坛上获得帮助。这里的协议是什么?只是链接到它或粘贴它?

假设 autoform 4.0+

在你的afQuickField,添加属性afFieldInput-template="optionExtras"

然后定义该覆盖主题模板。模板名称应为输入类型模板+“_”+您的主题模板名称。在您的情况下,您想要覆盖“select-radio”类型模板,正如您在此处看到的那样,它被命名为afRadioGroup. 所以完整的模板名称应该是“afRadioGroup_optionExtras”。

<template name="afRadioGroup_optionExtras">
  // your template
</template>

我建议复制引导主题模板及其所有模板助手。然后你可以添加你的额外内容。为了传入数据,将自定义属性添加到您的afQuickField中,然后您可以在 下的主题模板中访问它们this.atts

于 2014-11-12T12:17:38.200 回答