Question

如何使用TypeScript填充observableArray（KnockoutJS）？我有一个类作为我的ViewModel。

如果没有TypeScript，我会使用$.getJSON();加载数据并映射它。

function ViewModel() {
    var self = this;

    self.list_data = ko.observableArray([]);

    $.getJSON('/Home/Get', function (data) {
        var mapped = $.map(data, function (obj) { return new AClass(obj); });
        self.list_data(mapped);
    });
}

到目前为止，这是我的类，我在构造函数中加载数据并获取JSON数据数组。我也尝试过映射它，但没有运气。

如何在TypeScript类的list_data = ko.observableArray([]);中存储/映射它？

class MyViewModel {
    constructor() {
        $.getJSON('/Home/Get', function (data) {
            alert(data);
        });
    }

    list_data = ko.observableArray([]);
}

由于

修改

以下是来自服务器的数据：

[{ "Product": "102289", "ArtworkId": 19431, "IsDownloaded": 1 },
    { "Product": "272203", "ArtworkId": 19423, "IsDownloaded": 1 },
    { "Product": "272222", "ArtworkId": 20306, "IsDownloaded": 1 },
    { "Product": "332245", "ArtworkId": 19430, "IsDownloaded": 1 },
    { "Product": "382277", "ArtworkId": 19424, "IsDownloaded": 0 },
    { "Product": "382256", "ArtworkId": 19425, "IsDownloaded": 1 },
    { "Product": "392272", "ArtworkId": 19416, "IsDownloaded": 1 },
    { "Product": "422242", "ArtworkId": 19422, "IsDownloaded": 1 },
    { "Product": "452295", "ArtworkId": 19414, "IsDownloaded": 0 },
    { "Product": "452219", "ArtworkId": 19421, "IsDownloaded": 0 },
    { "Product": "452214", "ArtworkId": 19413, "IsDownloaded": 0 },
    { "Product": "452223", "ArtworkId": 19415, "IsDownloaded": 1 },
    { "Product": "632204", "ArtworkId": 20051, "IsDownloaded": 1 },
    { "Product": "632238", "ArtworkId": 19432, "IsDownloaded": 1 },
    { "Product": "632295", "ArtworkId": 19419, "IsDownloaded": 1 },
    { "Product": "712220", "ArtworkId": 19417, "IsDownloaded": 1 },
    { "Product": "722240", "ArtworkId": 19433, "IsDownloaded": 1 },
    { "Product": "762258", "ArtworkId": 20273, "IsDownloaded": 0 },
    { "Product": "762278", "ArtworkId": 20274, "IsDownloaded": 1 },
    { "Product": "792297", "ArtworkId": 19418, "IsDownloaded": 1 },
    { "Product": "812202", "ArtworkId": 19429, "IsDownloaded": 0 },
    { "Product": "862280", "ArtworkId": 19420, "IsDownloaded": 1 }]

Answer 1

这就是TypeScript中的样子：

class MyViewModel {
    list_data = ko.observableArray([]);
    constructor() {

        $.getJSON('/Home/Get', data => {
            var mapped = $.map(data, obj => new AClass(obj));
            this.list_data(mapped);
        });
    }
}

This will compile into：

var MyViewModel = (function () {
    function MyViewModel() {
        var _this = this;
        this.list_data = ko.observableArray([]);
        $.getJSON('/Home/Get', function (data) {
            var mapped = $.map(data, function (obj) { return new AClass(obj); });
            _this.list_data(mapped);
        });
    }
    return MyViewModel;
})();

KnockoutJS使用TypeScript填充observableArray

1 个答案: