Как привязываться к объекту в repeat.for с Aurelia

Question

В настоящее время я пытаюсь создать пользовательский элемент со свойством bindable и привязать его к переменной цикла 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> 

мнение, что с помощью пользовательский элемент находится ниже:

<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> 

Игра объект выглядит следующим образом:

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

Теперь, когда я запускаю код, в console.log заявление в игре-card.js метода связывания распечатки неопределенной для GameData, но печатает правильное название игры для заявления console.log('name: ' + this.name). Я не могу понять, почему привязка работает, когда я привязываюсь к свойству игрового объекта, но не тогда, когда я привязываюсь к самому игровому объекту. Любая помощь будет принята с благодарностью, большое вам спасибо!

Answer 1

Вы должны написать game-data.bind вместо gameData.bind. С первого взгляда, это должна быть единственная проблема