Saya baru memulai dengan Knockout JS, dan saya kesulitan menemukan apa yang salah di sini. Saya memanggil Layanan Web pengontrol untuk mendapatkan beberapa data yang ingin saya tampilkan di halaman saya.

Ini adalah ViewModel saya:

function ViewModel() {
    var self = this;

    self.MonthSalesList = ko.observableArray();

    var url = 'myurl';

    self.GetQueryData = function () {
        $.ajax({
            type: "GET",
            url: url,             
            dataType: "json",
            success: function (data) {
                console.log('callback success');
                console.log(data);
                var observableData = ko.mapping.fromJS(data);
                var array = observableData();
                self.MonthSalesList(array);
            },         
            error: function (jq, st, error) {
                alert(error);
            }           
        });
    }
}

$(document).ready(function () {
    ko.applyBindings(new ViewModel());
});

Dan di html:

<body>
    <table>
        <thead>
            <tr>
                <th>Year</th>
                <th>Mes</th>
                <th>Ano Atual</th>
                <th>Ano Anterior</th>
                <th>Variação</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: vendasMesList">
            <tr>
                <!-- <td data-bind="text: ko.toJSON($data)"></td> -->

                    <td data-bind="text: Year"></td>
                    <td data-bind="text: Mes"></td>
                    <td data-bind="text: Ano Atual"></td>
                    <td data-bind="text: Ano Anterior"></td>
                    <td data-bind="text: Variação"></td>

                </tr>
            </tbody>
        </table>
        <br/>
        <input type="button" value="Get Sales" data-bind="click: GetQueryData" />
    </body>

Ketika saya memuat halaman dan mengklik "Dapatkan Penjualan", saya hanya mendapatkan nilai pertama dari data json:

enter image description here

Data yang saya coba dapatkan terlihat seperti ini di Postman:

enter image description here

Satu-satunya perbedaan yang saya lihat adalah tipe numerik "Ano Atual".

Apakah ada yang tahu apa yang saya lakukan salah?

Terima kasih.

0
Dreekun 27 Maret 2020, 21:43

1 menjawab

Jawaban Terbaik

Anda perlu mengubah ini:

<td data-bind="text: Ano Atual"></td>
<td data-bind="text: Ano Anterior"></td>

... menjadi ini:

<td data-bind="text: $data['Ano Atual']"></td>
<td data-bind="text: $data['Ano Anterior']"></td>

Itu jelek, tapi sepertinya menjadi cara yang tepat.

1
OfirD 29 Maret 2020, 22:45