Question

我正在尝试使用包含选择下拉菜单的表单制作页面。我想让选择选项来自集合，而不是在HTML中手动输入。到目前为止没有运气。这是我的代码：

HTML：

<template name="addPage">
    <div id="addForm">
        <form>
            <ul>
                <li>
                    <label>Select a genre:</label>
                    <select id = "genreList">
                        {{#each genres}}
                            {{> genre}}
                        {{/each}}
                    </select>
                </li>
                <li><input type="submit" value="Submit"></li>
            </ul>
        </form>
    </div>
</template>

<template name="genre">
    <option value="{{genre}}">{{genre}}</option>
</template>

js：（使用mongodb聚合进行不同的调用）

Template.addPage.genres = function () {

  Activities.distinct("genre", function(error, result){

    var returnArray = new Array();

    for(var i in result) {
      returnArray[i] = { 'genre': result[i] };
    }

    return returnArray;
  });
}

使用此代码，选择下拉列表为空。我正在尝试做什么？

PS。我想也许函数Template.addPage.genres在数组填充之前返回...

谢谢！

Answer 1

我通过使用渲染的回调来解决这个问题：

Template.addPage.rendered = function() {
  Activities.distinct("genre", function(error, result){        
    result.sort();
    var genreList = document.getElementById('genreList');
    for(var i in result){
      var option=document.createElement("option");
      option.text=result[i];
      genreList.add(option, null);
    }
  });
}

Answer 2

我使用Mongo的find方法完成了此操作，以将Collection公开给模板：

Template.addPage.genres = function() {
   return Genres.find({}, {sort:{time: -1}});       
}

Meteor：使用mongo集合中的对象填充表单选择

2 个答案: