来自路由器和配方的数据上下文未显示

时间:2015-10-19 19:18:20

标签: meteor iron-router meteor-blaze

我从路由器获取数据上下文并且我的食谱页面上没有显示食谱。我想问一下我在这里做错了什么?

collections.js

Recipes = new Mongo.Collection('recipes');

router.js

Router.route('/recipes', function () {
    this.render('recipes',{
            name:'recipes'
        },
        {
            data: function(){
            return Recipes.find();
        }
    });
});

recipes.html

<template name="recipes">
    {{#each recipes}}
        <div class="container" style="margin-top:10px;">
            <div class="row form-group">
                <div class=" col-md-4">
                    <div class="panel panel-default">
                        <div class="panel-image">
                            <img src="{{image}}" class="panel-image-preview" />
                        </div>
                        <div class="panel-body">
                            <h4>{{name}}</h4>
                            <p>{{description}}</p>
                        </div>
                        <div class="panel-footer text-center">
                            <a href="#"><span class="glyphicon glyphicon-open-file"></span></a>
                            <a href="#"><span class="glyphicon glyphicon-time" style="vertical-align:middle"></span><small> {{time}}</small></a>
                            <a href="#"><span class="glyphicon glyphicon-heart " style="vertical-align:middle"></span><small>15 </small></a>
                            <a href="#"><span class="glyphicon glyphicon-share"></span></a>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    {{/each}}
</template>

1 个答案:

答案 0 :(得分:1)

你的路线搞砸了。您似乎以一种无法解析的方式混合路径选项和渲染选项。此外,您的数据上下文没有作为字段的配方。

也许以下是你想要的?

Router.route('/recipes', function () {
    this.render('recipes', {
        data: function() {
            return { recipes: Recipes.find() };
        }
    });
}, {
   name:'recipes',
});

我个人更喜欢将数据添加到路由而不是渲染调用,并尽可能使用路由选项:

Router.route('/recipes', {
   name: 'recipes',
   template: 'recipes',
   data: function() {
       return {recipes: Recipes.find()};
   }
});