在 Meteor 和 Iron Router 中设置数据上下文答案

【问题标题】：Setting up data contexts in Meteor and Iron Router在 Meteor 和 Iron Router 中设置数据上下文
【发布时间】：2016-02-05 11:08:21
【问题描述】：

我正在寻求一些建议，以了解使用 Iron Router 为 MongoDB 数据库设置数据上下文的最佳方式。

为了说明我正在从事一个相当基本的电影评论项目，并通过 http://reviews-48062.onmodulus.net/ 部署到 Modulus

这将返回评论列表，但希望使用路由来创建其他页面。我在本地安装了 Iron Router，并有一个本地 MongoDB 集合（称为任务），其中包含一些数据。

重新编写了一些代码以包含路由信息。这可以成功显示路线，但似乎没有将任何数据拉入 {{each}} 语句。

我的JS代码如下：

// define Mongodb collection

Tasks = new Mongo.Collection("tasks");

// set up home route and database query

Router.route('/', function () {
this.render('Home', {
tasks: function () { return Tasks.find({}, {sort: {title: 1}, limit: 10}); }
});
});

// define routes
Router.route('/one');

Router.route('/two');

Router.route('/three');

HTML 代码是：

<head>
<title>Iron router sandbox</title>
</head>

<body>
</body>

<template name="Home">
{{> Nav}}

<h1>Home</h1>

<p>This is a test</p>
{{#each tasks}}
<li>
<strong>{{title}}</strong>
<p>Directed by {{director}}</p>
<p>{{review}}</p>
<p>Available on: {{format}}</p>
</li>
{{/each}}
</template>

<template name="One">
{{> Nav}}

<h1>Page One</h1>
<p>Some more text.</p>
</template>

<template name="Two">
{{> Nav}}

<h1>Page Two</h1>
<p>A bit more text.</p>
</template>

<template name="Three">
{{> Nav}}

<h1>Page Three</h1>
<p>Even more text.</p>
</template>

<template name="Nav">
<ul>
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/one">Page One</a>
</li>
<li>
<a href="/two">Page Two</a>
</li>
<li>
<a href="/three">Page Three</a>
</li>
</ul>
</template>

我的理解是数据上下文是为“Home”模板设置的，所以不确定代码有什么问题。

非常感谢任何建议。

【问题讨论】：

在reviews-48062.onmodulus.net 中似乎有效。它与您的代码不同吗？

标签： meteor iron-router

【解决方案1】：

tasks 不是发送到该对象的有效属性。您需要改用data 为 IronRouter 设置数据上下文。将tasks 更改为data，然后在您的模板上设置一个助手来获取任务数据：

Template.Home.helpers({
    tasks() {
        return Tasks.find({}, {sort: {title: 1}, limit: 10});
    }
});

【讨论】：

非常感谢斯蒂芬。我现在已经设置了助手，它工作正常。

【解决方案2】：

您可以使用 i-r 返回数据上下文，但需要将其命名为 data：

Router.route('/', function () {
  this.render('Home', {
  data: function () {
    return { tasks: Tasks.find({}, {sort: {title: 1}, limit: 10}); } };
  });
});

这会将数据上下文返回到您的模板，然后tasks 键将包含任务光标。

【讨论】：