javascript - 如何将集合插入到 meteor 表单中

Question

我正在尝试制作一个基本的食谱表单，其中包含另一个表单。内部形式使用集合。我正在尝试将该集合输入到更大的表单中。我不确定如何编写该特定部分的代码。

Ingredients = new Mongo.Collection('ingredients');
Recipe = new Mongo.Collection('recipe');

    'submit .recipe_submit': function(event){

        Recipe.insert({
            recipeServing:event.target.mealserving.value,
            recipeIngredients:event.target.,
            recipeDirection:event.target.recipedirections.value

        })
    }


 <template name="addingredients">
         <h2>Enter Ingredients</h2>
                 <form class="form-group">
                     Food Item</span><input name="ingredientType" type="text">
                     Quantity</span><input name="ingredientQuantity" type="text">
                     Amount</span><input name="ingredientAmount" type="text" >
                    <button type="submit">Add</button>
                 </form>
                 <div class="col-md-12">
                     <ul>
                         {{#each ingredients}}
                             <li >
                                 <div>
                                     <div>{{this.foodItem}}</div>
                                     <div>{{this.foodQuantity}}</div>
                                     <div>{{this.foodAmount}}</div>
                                     <div class="delete"></div>
                                </div>
                             </li>
                         {{/each}}
                     </ul>
                 </div>

 </template>

通常我会使用输入中的 name=""，但我不知道在这种情况下这是如何工作的。我也不需要它来导入删除按钮。任何帮助都会很棒。

Answer 1

您的事件需要正确提取每个值。以下是如何执行此操作的示例:

Template.addingingredients.events({
    'submit .recipe_submit': function(event, template){

        Recipe.insert({
            recipeType: template.$("input[name=ingredientType]").val(),
            recipeQuantity: template.$("input[name=ingredientQuantity]").val(),
            recipeAmount: template.$("input[name=ingredientAmount]").val()
        })
    }
});

我必须重命名食谱中的键以匹配字段名称，您的表单上没有“服务”、“成分”或“方向”元素。不过，我认为这不是您在问题中寻找的内容。

关键点是如果您想从元素中提取值，您可以使用类似 $("input[name=ingredientQuantity]").val() 的内容获取像 <input name="ingredientQuantity" type="text"/> 这样的元素的值