流星:在集合内的对象上循环

Meteor: Iterating over an Object inside of a Collection

本文关键字:对象 循环 集合 流星      更新时间:2023-09-26

我已经遇到过几次这个问题,它慢慢地让我发疯。简短的问题:当给定一个包含Object作为字段的集合时,我们如何在模板中迭代该对象。

集合中的每个条目看起来都是这样的:

{
    "_id" : "jsWmXTvocbSMM5JAF",
    "userId" : "gcko4Eo3YtZaWa8aj",
    "gameId" : "eduzNj8kWv7TdiEuE",
    "scores" : {
        "team1" : 3,
        "team2" : 1,
        "losses" : 7
    }
}

我们可以很容易地访问模板中的{{userId}}{{gameId}},但当然{{scores}}只是显示了我们所期望的[object object]。

我尝试使用{{#each scores}},我以前在数组中使用过它,但当然,这会引发一个错误:

{{#each}} currently only accepts arrays, cursors or falsey values.

然后我试着聪明一点(很少是个好主意),把一堆Object推到一个数组中,然后把它返回到模板:

Template.scorePad.helpers({
    scoresArray: function () {
        var arr = [], scores = this.scores;
        for (var key in scores) {
            var obj = {};
            obj[key] = scores[key];
            arr.push(obj);
        }
        return arr;
    }
}

我不知道为什么我认为这是个好主意,因为这只是为模板提供了一个看起来像这样的数组:

[{team1: 3}, {team2: 1}, {losses: 7}]

是的,太好了。。我可以在上面打印#each,但它只打印了三次object Object。正如预期的那样。但我在这里,覆盖了所有的基地。

Meteor github存在一个悬而未决的问题(关于无法将@key#each一起使用),但我真的希望有人能找到一个简单的解决方案。

这个问题有点接近我正在做的事情,但一点也不一样。

我还尝试了#with,结果基本相同。

基本上,我正在寻找一种优雅的"流星"方式来做到这一点,如果有的话。很明显,我不是专家。那该怎么办?

编辑回答评论:为了澄清,在模板中,理想的解决方案(不起作用)是在我的html中使用这样的东西,并迭代集合数据中得分内的每个键:值对:

<div> {{#each scores}} {{this.key}} {{this.value}} {{/each}} </div>

并迭代集合数据中得分内的每个键:值对。

你能试试这个吗:

Template.scorePad.helpers({
scoresArray: function () {
    var arr = [], scores = this.scores;
    for (var key in scores) {
        var obj = {};
        obj.key = key;
        obj.value = scores[key];
        arr.push(obj);
    }
    return arr;
  }
}

并像这样迭代:

<div>
{{#each scores}}
    {{this.key}}
    {{this.value}}
{{/each}}
</div>