如何添加多个图像/元素，其中数量取决于 user.variable？

Posted 2023-03-08

【中文标题】如何添加多个图像/元素，其中数量取决于 user.variable？

【英文标题】：How can I add a number of images/elements, where the number depends on a user.variable?

【发布时间】：2014-01-06 16:36:40

【问题描述】：

我想为user.balloons 中的每个气球创建一个气球图像。如果user.balloons = 20，我想在屏幕上显示 20 个气球图像（在随机位置，如果有人想给我提示。）

这是我的第一个项目，很抱歉这么简单。我试过了：

#each user.balloon <img ... > /each

没有运气，目前正在尝试类似： js：

Template.main.objects= function()
  return [name:"balloon",src:"/img/balloon.png", number: user.balloons,name:"partyhat",src:"/img/partyhat.png", number: user.partyhat];

还有html：

#each objects
  #each number
    <img src="src" style="margin-left:number%">
  /each
/each

但由于各种原因，这不起作用。任何帮助都会很棒。

（另外，我在将 user. 添加到上述数组时遇到了问题，Meteor 似乎不喜欢它，有时会崩溃，如果我需要在里面引用 user.variables，任何人都知道如何解决这个问题？ )

【参考方案1】：

我会添加一个这样的助手：

Template.main.balloons = function(n) 
   return _.range(n);

然后你可以制作任意数量的气球：

#each balloons 20
   <img...>
/each

在循环内部，this 将返回当前索引，以防您出于任何原因需要它。

显然，如果您总是想使用user.balloons 的值作为气球的数量，最好将其硬编码到模板助手中：

Template.main.balloons = function() 
   return _.range(Meteor.user().balloons);

然后不带参数调用each。

【讨论】：

邪恶！谢谢，那行得通。虽然在实现它时我遇到了我提到的“用户未定义”问题。通过添加流星修复。 user.balloons 的前缀，但我真的不明白为什么会这样，或者最初的问题是什么。非常感谢！

哦，还有，是否可以在 each 中做一个 each，例如：each object #each thing /each /每个 ？我试过了，但它返回一个解析错误“解析错误：...mg #each name

对不起，上面更新了。根据文档使用 Meteor.user() 检索当前用户：link。

呸，它停止工作，在更新一些不相关的 css 时再次给我用户未定义错误

首先，我认为您缺少第一个 #each 的 #。但是，假设这只是一个错字，问题是您试图在#each thing 中嵌套双胡须，这是您无法做到的。但这不是必需的：只需使用您需要的任何逻辑在辅助函数中返回正确的数组，该函数应该可以访问您需要的所有内容。如果您需要示例，请告诉我。