Question

我刚刚学习Meteor，并想知道是否有人可以帮我解决这个问题。我正在建立一个gumtree风格的列表网站，以便进行一些练习。

列表显示在屏幕上，显示用户创建的所有最新列表。（以下示例代码）

我想知道的是，如何将横幅随机插入项目列表（想想赞助项目样式）。我希望每次加载页面时，都会在列表中的随机点插入一大块HTML。

我尝试将结果listing.find（）放入一个数组中，然后在results_list.js中推送广告，但这并不起作用。在做了一些阅读后我得到了它，因为你只是返回光标，所以我不太清楚如何去做。我来自纯粹的角度背景。

我的猜测是某种辅助函数，但我不确定从哪里开始，所以任何指向正确方向的人都会非常感激。

results_list.html

<template name="resultsList">
    {{#each results}}
        {{> resultDetails}}
    {{/each}}
</template>

results_list.js

Template.resultsList.helpers({
  results: function() {
    return Listings.find({}, {sort: {submitted: -1}});
  }
});

UPDATE！

道歉的家伙，我读了一些更多的文档，我想我已经解决了，仍然希望得到你对这个解决方案的反馈，尽管可能有更好的方法来做到这一点。

这应该在随机点添加广告（不包括开头和结尾）。我将修改resultDetails模板，使广告的选项为true，同时显示广告代码。

Template.resultsList.helpers({
  results: function() {
    var searchResults = Listings.find({}, {sort: {submitted: -1}}).fetch();
    searchResults.splice(_.random(1, results.length - 1), 0, {advertisement: true});
    return searchResults;
  }
});

Answer 1

一种简单的方法是修改您的resultDetails模板。

<template name='resultDetails'>
  {{#if showBanner}}
    {{> banner}}
  {{/if}}
  ..resultDetails html..
</template>

您的帮助函数可以根据随机返回showBanner：

Template.resultDetails.helpers({
  showBanner: function(){
    return Math.random()>0.98; // show the banner with probability 0.02
  }
});

如果你有像那样的规则，那么这将会变得更复杂一些。在这种情况下，您需要根据完整光标执行逻辑（例如，在onRendered的{{1}}处理程序中）并预先计算列表中您要显示的位置横幅。

使用Meteor将项目插入列表UI

1 个答案: