Wie binden Objekt wiederholen.mit Aurelia

Ich bin versucht derzeit, erstellen Sie ein benutzerdefiniertes element mit einer bindbare Eigenschaft, und an diese Eigenschaft auf die Variablen eines wiederholen.for-Schleife. Dies scheint, wie es sollte eine einfache Aufgabe sein, aber ich kann nicht ankommen es zu wirken, und Frage mich, ob es vielleicht zu tun hat mit der Variablen um ein Objekt handelt. Der code für meine custom-element ist unten:

game-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);
  }
}

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

Der Ansicht, dass ist mit dem custom element ist unten:

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

Den Spiele-Objekt sieht wie folgt aus:

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

Wenn ich jetzt den code ausführen, der Konsole.log-Anweisungen in den game-card.js bind-Methode drucken Sie undefiniert, für die gameData, aber druckt der richtige name des Spiels für die console.log('name: ' + this.name) – Anweisung. Ich kann nicht herausfinden, warum die Bindung zu arbeiten, wenn ich eine Bindung an eine Eigenschaft des Spiel-Objekts, aber nicht, wenn ich Sie binden das Spiel-Objekt selbst. Jede Hilfe wäre sehr geschätzt, danke!

InformationsquelleAutor KevinM | 2016-04-11

 

One Reply
  1. 9

    Schreiben Sie game-data.bind statt gameData.bind. Aus den ersten Blick, sollte dies das einzige problem

    • Genau das ist es. Vielen, vielen Dank!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.