Meteor：带有对象数组的自定义 AutoForm

Question

我有一个包含对象数组的 SimpleSchema：

Things.attachSchema( new SimpleSchema({
    name: {
        type: String,
        label: "Name",
        max: 50
    },
    fields: { 
        type: [Object],
    },
    fields.$.name: {
        type: String
    },
    fields.$.amount: {
        type: Number
    }
}) )

我正在尝试使用 afEachArrayItem 创建自定义表单，但我不知道如何引用数组中每个对象的属性。

我的模板看起来像这样（去掉了 html）：

{{#autoForm collection="things" id="myForm" }}
    {{> afQuickField name='schemaName'}}

    {{#afEachArrayItem name="fields"}}

        {{> afFieldInput name="name"}  
        {{> afFieldInput name="amount"}

    {{/afEachArrayItem}}

{{/autoForm}}

在 afFieldInputs 中应该将什么传递给“name”？

Answer 1

要访问数组中对象的字段，可以使用：

this.current

所以要修复上面给出的示例，请使用：

{{#autoForm collection="things" id="myForm" }}
    {{> afQuickField name='schemaName'}}

    {{#afEachArrayItem name="fields"}}

        {{> afFieldInput name=this.current.name}}  
        {{> afFieldInput name=this.current.amount}}

    {{/afEachArrayItem}}

{{/autoForm}}

我不知道这是否是正确的方法，但它似乎有效。

Answer 2

您可以像这样添加按钮来添加/删除数组项：

{{#autoForm collection="things" id="myForm" }}
    {{> afQuickField name='schemaName'}}

    {{#afEachArrayItem name="fields"}}

        <button type="button" class="btn btn-primary autoform-remove-item"><span class="glyphicon glyphicon-minus"></span></button>
        {{> afFieldInput name=this.current.name}}  
        {{> afFieldInput name=this.current.amount}}

    {{/afEachArrayItem}}
    <button type="button" class="btn btn-primary autoform-add-item" data-autoform-field="fields"><span class="glyphicon glyphicon-plus"></span></button>

{{/autoForm}}

这将使用 AutoForm 的内置按钮和图标，因此可以根据需要随意修改 HTML。