Javascript 在游戏控制器中获取计算属性

我正在创建一个小的多人游戏使用灰烬的前端

我在主页上有一个游戏列表，我想显示一个游戏中有多少张牌

App.Game = DS.Model.extend({
    serverSeedHash: DS.attr(),
    serverSeed: DS.attr(),
    table: DS.belongsTo('table'),
    bingoCards: DS.hasMany('bingoCard')
});
App.BingoCard = DS.Model.extend({
    player: DS.attr(),
    clientSeed: DS.attr(),
    game: DS.belongsTo('game'),
    player: DS.belongsTo('player')
});
App.GamesRoute = Ember.Route.extend({
    model: function () {
        return Ember.RSVP.hash({
            games: this.store.find('game'),
            bingoCards: this.store.find('bingoCard')
        });
    },
    setupController: function (controller, model) {
        controller.setProperties(model);
    }
});

App.GamesController = Ember.ArrayController.extend({
    needs: ['game']
});

App.GameController = Ember.ObjectController.extend({
    amountOfCards: function () {
        return this.get('bingoCards.length');
    }.property('bingoCards.@each')
});

每当我去一个特定的游戏，我都可以通过在游戏模板中键入{{amountOfCards}}来访问amountOfCards属性

然而，当我试图在主页上显示它时，它在每个循环中都不起作用

{{#each game in games}}
<tr>
    <td>{{game.id}}</td>
    <td>{{amountOfCards}} {{game.amountOfCards}}</td>
    <td>{{#link-to 'game' game.id}}Join{{/link-to}}</td>
</tr>
{{/each}}

---

基本上我的问题是：我有多个游戏，每个游戏都有多个宾果卡。我想根据Bingocard计算每个游戏的属性。我该怎么做呢？

您必须指定一个itemController，将每个游戏包装成一个控制器，通常是您选择的ObjectController

模板

控制器

---

你可以在

上了解更多信息，我只是想知道，你的计算属性amountOfCards不应该在你的模型应用程序中吗？这对我来说更有意义。嗯，在这种情况下，这只是一个例子。我想用计算属性创建更多信息。就像总奖金池中的所有卡乘以卡的价格一样。如果我在模型中定义了，我的后端不应该提供这些值吗？我是Ember的新手，所以不确定当把{{游戏中的每一场比赛}改成{控制器中的每一场比赛}时，突然就没有结果了。哦，是的，我没有看到App.GamesRoute中的错误，我更新了anwser。控制器现在确实有游戏了。但是宾果车不再装载了。现在调用amountOfCards，我使用console.log进行验证，但长度为零。。这就是我使用Ember.RSVP.hash来确定它是否是正确的解决方案的原因。我更新了我的答案，基本上在您的路径中，模型的返回会自动设置为控制器的内容属性。在我们的例子中，content属性应该包含一个游戏数组。再次感谢。我现在一定很烦了。我现在得到了游戏列表，但是amountOfCards属性仍然是0。而且所有的宾果都会被装载。每当我进入一个特定的游戏/游戏/1时，我都会得到正确数量的牌。

{{#each game in controller}}
<tr>
    <td>{{id}}</td>
    <td>{{amountOfCards}}</td>
    <td>{{#link-to 'game' id}}Join{{/link-to}}</td>
</tr>
{{/each}}

App.GamesRoute = Ember.Route.extend({
    model: function() {
        return Ember.RSVP.all([
            this.store.find('game'),
            this.store.find('bingoCard')
        ]);
    },

    setupController: function(controller, model) {
        var games = model[0];
        controller.set('content', games);
    }
});

App.GamesController = Ember.ArrayController.extend({
    itemController: 'game'
});

App.GameController = Ember.ObjectController.extend({
    amountOfCards: function () {
        return this.get('bingoCards.length');
    }.property('bingoCards.@each', 'bingoCards.length')
});