如何使用autoform使用#each填充select元素？

Question

這是我想要轉換爲使用autoform的表單的一部分。

<div class="col-lg-4 col-md-4 col-sm-4"> 
<label for="pay_with" id="pay_with_label">Pay With</label> 
<select name="pay_with" id="pay_with" class="form-control select select-primary mbl" required data-placeholder="Select an Option"> 
    <option value="Card">New Card</option> 
    <option value="Check">New Bank</option> 
    {{#each device}} 
     <option value="{{card_id}}" selected {{selected}}>{{brand}} - {{last4}}</option> 
    {{/each}} 
</select> 

在自動窗體，我怎麼翻譯這個部分？

{{#each device}} 
    <option value="{{card_id}}" selected {{selected}}>{{brand}} - {{last4}}</option> 
{{/each}} 

Answer 1

創建一個返回的選項排列您的選擇菜單，通過映射你的設備陣列，爲了得到自動窗體正確的架構，像這樣增加的額外的選項模板輔助函數：

Template.myForm.helpers({ 
    deviceOptions: function() { 

     var deviceOpts = devices.map(function(device) { 
     return { label: device.brand+' - '+device.last4, value: device.card_id } 
     }); 

     deviceOpts.unshift({ label: 'New bank', value: 'Check' }); 
     deviceOpts.unshift({ label: 'New card', value: 'Card' }); 

     return deviceOpts; 
    }, 
}); 

然後，你可以調用助手在你的模板指令：

{{> afFieldInput name="payWith" type="select" options=deviceOptions }}