1

私はMVVMと次のようなモデルを持っています。

var my = my || {};

$(function () {

 my.ListModel = (function () {
    var 
        data = ko.observableArray([]),
        totalCount = ko.observable(),
        page = ko.observable(),
        limit = ko.observable(),
        goTo = function (d) {
            $.getJSON("/prices/GetByFilterViaJSON", { limit: limit, page: d }, function (list) {
                data(list.Data);
                page(list.Page);
            });
        },
        loadData = function (url) {
            $.ajax({
                type: 'GET',
                url: url,
                dataType: 'json',
                success: function (list) {
                    data(list.Data);
                    page(list.Page);
                    totalCount(list.TotalCount);
                },
                data: { limit: limit },
                async: false
            });
        };
    return {
        Data: data,
        TotalCount: totalCount,
        Page: page,
        Limit: limit,
        GoTo: goTo,
        LoadData: loadData
    };
})();

my.PriceListViewModel = (function () {

    var
        grid1 = ko.observable(),
        grid2 = ko.observable(),
        loadGrid = function () {
            grid1(my.ListModdel);
            grid1().Limit(5);
            grid1().LoadData('/prices/GetByFilterViaJSON');

            grid2(my.ListModel);
            grid2().Limit(3);
            grid2().LoadData('/prices/GetByUserViaJSON');
        };
    return {
        Grid1: grid1,
        Grid2: grid2,
        LoadGrid: loadGrid
    };
})();

my.PriceListViewModel.LoadGrid();
ko.applyBindings(my.PriceListViewModel);
});

そして私は彼らに問題があります。ご覧のとおり、LoadData（PriceListViewModel内）がトリガーされると、Grid1はGrid2と同じ値になります。問題は何ですか、どうすればこれを解決できますか？

4

1 に答える 1

3

ListModelsをインスタンス化するには、newを使用する必要があります。

var my = my || {};

$(function () {

 my.ListModel = function () {
    var 
        data = ko.observableArray([]),
        totalCount = ko.observable(),
        page = ko.observable(),
        limit = ko.observable(),
        goTo = function (d) {
            $.getJSON("/prices/GetByFilterViaJSON", { limit: limit, page: d }, function (list) {
                data(list.Data);
                page(list.Page);
            });
        },
        loadData = function (url) {
            $.ajax({
                type: 'GET',
                url: url,
                dataType: 'json',
                success: function (list) {
                    data(list.Data);
                    page(list.Page);
                    totalCount(list.TotalCount);
                },
                data: { limit: limit },
                async: false
            });

    return {
        Data: data,
        TotalCount: totalCount,
        Page: page,
        Limit: limit,
        LoadData: loadData
    };
};

my.PriceListViewModel = (function () {

    var
        grid1 = ko.observable(),
        grid2 = ko.observable(),
        loadGrid = function () {
            grid1(new my.ListModel());
            grid1().Limit(5);
            grid1().LoadData('/prices/GetByFilterViaJSON');

            grid2(new my.ListModel());
            grid2().Limit(3);
            grid2().LoadData('/prices/GetByUserViaJSON');
        };
    return {
        Grid1: grid1,
        Grid2: grid2,
        LoadGrid: loadGrid
    };
})();

my.PriceListViewModel.LoadGrid();
ko.applyBindings(my.PriceListViewModel);
});
于 2012-09-13T09:19:58.930 に答える