在 ajax 获得后更新一个可观察到的属性淘汰赛

Question

我正在尝试使用 AJAX get 在我的淘汰赛应用程序中实施过滤，并且我只想更新视图模型中众多可观察对象中的一个。这是我在 JS 中的视图模型

function containerViewModel() {
mainViewModel = this;
mainViewModel.isBusy = ko.observable(false);
mainViewModel.errorMessage = ko.observable("");
mainViewModel.containerModel = ko.observable(
    {
        HomeSettings: ko.observable(),
        Employee: ko.observable(),
        Class: ko.observable(),
        Degree: ko.observable(),
        Specialization: ko.observable(),
        }
        );

    GET_AllContainer(mainViewModel);
}

这些可观察对象中的每一个都显示在不同的选项卡中，并且每个选项卡都有过滤器按钮。当我从任何选项卡单击过滤器按钮时，我使用 ajax 调用获取数据。但问题是我正在获取整个数据并像这样绑定到视图模型

function GET_FilteredContainer(mainView, filterText, productID, FilterID) {
mainViewModel.isBusy(true);
$.ajax({
    url: hostApi + api_GetAllContainer,
    contentType: "json",
    data: { FilterLinkIds: filterText, ProductID: productID },
    success: function (result) {
        mainView.containerModel(result);            
        SetFilterButtonCSS(productID, FilterID);
        ProductReportsNotFound(result);
        mainViewModel.isBusy(false);
    },
    error: function (result) {
        mainViewModel.errorMessage(result);
        mainViewModel.isBusy(false);
    }
});
}

但这意味着它将清除其他选项卡的过滤器。那么有什么办法可以只更新所需的可观察值

谁能帮帮我。

Answer 1

嗯，代码中有不少错误

mainView.containerModel(result) 是一个 Major one 你不能这样做，因为它会替换整个可观察内容，因为在你的情况下它会替换你在声明中的可观察内容（ containerModel) 而不是填充那些（正如您可能认为的那样）。

viewModel:

var ViewModel = function () {
    var self = this;
    self.containerModel = ko.observable({
        HomeSettings: ko.observable(),
        Employee: ko.observable(),
        Class: ko.observable(),
        Degree: ko.observable(),
        Specialization: ko.observable(),
    });

     var result = [{'HomeSettings':[1,2,3,4],'Employee':1}]
        console.log("Object you getting at ajax call success")
        console.log(result) //sample check

    console.log("correct way1 o/p")
    self.containerModel().HomeSettings(result[0].HomeSettings);
    self.containerModel().Employee(result[0].Employee);
    //like that for everything i.e see console everything is a function 
    console.log(self.containerModel())                                
};
ko.applyBindings(new ViewModel());

样本工作 fiddle here

PS: 明智的方法是在外部编写一个函数并在其中声明您可观察到的。稍后您可以使用 .map 或 mapping plugin 以一种灵活的方式将您的分配给 containerModel observable

在 ajax 获得后更新一个可观察到的属性淘汰赛

Updating one observable property of knockout after ajax get

knockout.js

knockout-mvc

在 ajax 获得后更新一个可观察到的 属性 淘汰赛

Updating one observable property of knockout after ajax get

knockout.js

knockout-mvc

在 ajax 获得后更新一个可观察到的属性淘汰赛