如何使用 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>

使用自定义元素的视图如下：

<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 绑定方法打印出未定义的游戏数据，但打印出正确的名称console.log('name: ' + this.name) 语句的游戏。我无法弄清楚为什么当我绑定到游戏对象的属性时绑定起作用，但当我绑定到游戏对象本身时却不起作用。任何帮助将不胜感激，非常感谢！

Answer 1

你必须写 game-data.bind 而不是 gameData.bind。乍一看，这应该是唯一的问题

如何使用 Aurelia 绑定到 repeat.for 中的对象

How to bind to object in repeat.for with Aurelia

javascript

aurelia