2

わかりました、私はまだ JavaScript オブジェクトを繰り返し処理することに少しあいまいです。jQuery と Knockout を使用して、JSON として送信されたサーバー データを吐き出しています。配列の実際の値が適用されていないように見えることを除いて、すべてがうまく機能しているように見えますが、テーブル行が構築され、エラーがないため、Guest(data){} 関数を使用する必要があります。おそらく値ではなくキーを指しているような気がします。私のコードと JSON 構造を見て、どう思うか教えてください。

<table>
    <tbody data-bind='foreach: guests'>
        <tr>
            <td data-bind='value: name'></td>
            <td data-bind='value: email'></td>
            <td data-bind='value: guests'></td>
            <td data-bind='value: code'></td>
        </tr>
    </tbody>
</table>

<body>
</body>
<script type="text/javascript">

function Guest(data){
    this.name = ko.observable(data.name);
    this.email = ko.observable(data.email);
    this.guests = ko.observable(data.guests);
    this.code = ko.observable(data.code);   
}

function guestListViewModel(){
    //Data
    var self = this;
    self.guests = ko.observableArray([]);

    $.getJSON('/php/guests_json.php', function(json) {
        var mappedGuests = $.map(json, function(item) { return new Guest(item) });
        console.log(mappedGuests);
        self.guests(mappedGuests);
    });
}

ko.applyBindings(new guestListViewModel);

</script>

サーバーから見た JSON は次のようになります。

[{
    "id":"8",
    "name":"Greg",
    "email":"greg1@google.com",
    "guests":"1",
    "code":"GVTRKwRPXD2rETD10BMCWWAB",
    "checked_in":"0"},
{
    "id": ....
4

2 に答える 2

1

ああ、私はそれを理解しました。完全に機能していた私のJSONオブジェクトとは何の関係もありませんでした。要素に適用するデータバインディングの種類に注意する必要があります。テキストスパン'テキスト'バインダーの代わりに入力'値'バインダーを使用していました。

これはそれを修正しました：

<table>
    <tbody data-bind='foreach: guests'>
        <tr>
            <td data-bind='text: name'></td>
            <td data-bind='text: email'></td>
            <td data-bind='text: guests'></td>
            <td data-bind='text: code'></td>
        </tr>
    </tbody>
</table>
于 2012-10-18T21:06:38.007 に答える
0

jsonはオブジェクトの配列を返します。おそらく、次のように配列の最初の値（オブジェクトを持つ値）を渡してみてください。

var mappedGuests = $.map(json[0], function(item) { return new Guest(item) });
于 2012-10-18T20:50:23.680 に答える