Aureliaでrepeat.forのオブジェクトにバインドする方法

Question

現在、バインド可能なプロパティを持つカスタム要素を作成し、そのプロパティにrepeat.forループの変数にバインドしようとしています。これは単純な作業でなければならないようですが、動作させることができず、変数であるオブジェクトと関係があるかどうか疑問に思っています。私のカスタム要素のためのコードは以下の通りです：使用している

ゲーム-card.js

import { bindable } from 'aurelia-framework'; 

export class GameCard { 
    @bindable gameData = null; 
    @bindable name = ''; 

    bind() { 
    console.log('card-game-data: ' + JSON.stringify(this.gameData, null, 2)); 
    console.log('name: ' + this.name); 
    } 
} 

ゲーム-card.html

<template> 
    <div class="card medium"> 
    <h3 class="center-align left">${gameData.name}</h3> 
    <div class="right-align right">${gameData.isPublic}</div> 
    </div> 
</template> 

ビューカスタム要素は次のとおりです。

私は、コードを実行すると、

今

[{name: 'SomeName', isPublic: true}, {name: 'AnotherName', isPublic: false}] 

gameDataため、未定義のゲームcard.js bindメソッドのプリントアウトではconsole.logステートメントが、プリントアウト：

<template> 
    <require from="./game-card"></require> 
    <div> 
    <div class="row"> 
     <div repeat.for="game of games"> 
     <game-card class="col s6 m4 l3" gameData.bind="game" name.bind="game.name"></game-card> 
     </div> 
    </div> 
    </div> 
</template> 

ゲームオブジェクトは、次のように見えますconsole.log('name: ' + this.name)ステートメントのゲームの正しい名前。ゲームオブジェクトのプロパティにバインドするときにバインディングが動作する理由はわかりませんが、ゲームオブジェクト自体にバインドするときはわかりません。どんな助けでも大歓迎です、ありがとう！

Answer 1

gameData.bindの代わりにgame-data.bindを書かなければなりません。最初の一見から、これは唯一の問題でなければなりません