Question

我是Knockout的新手，我正在尝试从ajax调用更新我的ViewModel。
这就是我现在所拥有的：

的 LoanDeductions.js

var deductionLine = function (deductionID, deductionName, amount) {
    self = this;
    self.deductionID = ko.observable(deductionID);
    self.deductionName = ko.observable(deductionName);
    self.amount = ko.observable(amount);
};

function LoanDeductions(deductions) {
    var self = this;
    self.loanDeductions = ko.observableArray(ko.utils.arrayMap(deductions, function (deduction) {
        return new deductionLine(deduction.deductionID, deduction.deductionName, deduction.amount)
    }));

    // Operationss
    self.removeLine = function (line) { self.loanDeductions.remove(line) };
};

这是我视野中的脚本：

    @section scripts
    {
        <script src="~/Scripts/koModel/LoanDeductions.js"></script>
        <script type="text/javascript">
           var updateValues = function () {
               $.ajax({
               'url': '@Url.Action("UpdateDeductionValues","LoanApp")',
               'data': { amount: $('.LoanAmount').val() },
               'success': function (result) {// update viewmodel scripts here}
            });
            var viewModel = new LoanDeductions(@Html.Raw(Model.CRefLoansDeductions2.ToJson()));
            $(document).ready(function () {
                ko.applyBindings(viewModel);
                $('.datepicker').datepicker();
                $('.LoanAmount').change(function () {
                   updateValues();
                };
            });
        });
    </script>
    }

所以，在我看来，我有一个带有班级名称的下拉列表＆＃34; LoanAmount＆＃34;当值改变时，它将执行ajax调用，将选定的loanAmount值发送到服务器，重新计算扣除金额，然后服务器返回一个看起来像这样的jsonresult ：

"[{\"deductionID\":1,\"deductionName\":\"Loan Redemption Fee\",\"amount\":53.10},{\"deductionID\":2,\"deductionName\":\"Document Stamp\",\"amount\":9.00}]"

现在我想要做的是使用这个json数据作为我的新viewModel。
任何人都可以告诉我如何做到这一点，请注意我手动映射我的viewmodel并没有使用ko映射插件。
任何帮助将不胜感激。谢谢，更多力量！

编辑（对Fabio的回应）

function updateData() {
        $.ajax({
            url: '@Url.Action("UpdateDeductionValues","LoanApp")',
            data: { amount: self.selectedLoanAmount() },
            success: function (deductions) {
                //load your array with ko.utils.arrayMap
                ko.utils.arrayMap(deductions, function (deduction) {
                return new deductionLine(deduction.deductionID, deduction.deductionName, deduction.amount)
                });
            }
        });
    }

Answer 1

不确定如果我理解你的问题，但如果你想改变课外的模型值，你需要做这样的事情：

        $(document).ready(function () {
            var viewModel = new LoanDeductions(@Html.Raw(Model.CRefLoansDeductions2.ToJson()));
              ko.applyBindings(viewModel);

            $('.datepicker').datepicker();

            function updateValues() {
                //do you ajax call
                //update the model using viewModel.loanDeductions(newItens);
            };

            $('.LoanAmount').change(function () {
               updateValues();
            };
        });

编辑1 - 只是为了展示如何在没有jquery.change的情况下使用knockout

function LoadDeductions() {
     //declare you properties
      var self = this;
      self.loanAmount = ko.observable('initialvalueofloanamount');
      self.loanDeductions = ko.observableArray();

     //create a function to update you observablearray
     function updateData() {
        $.ajax({
           url: '@Url.Content('yourActionhere')' or '@Url.Action('a', 'b')',
           data: { amount: self.loadAmount() },
           success: function (deductions) {
              //load your array with ko.utils.arrayMap
           }
        });
     }

     //everytime that loanAmount changes, update the array
     self.loanAmount.subscribe(function () {
        updateData();
     });

     //update values initializing
     updateData();

};

$(function() {
    ko.applyBindings(new LoadDeductions());
});

将HTML中的选项绑定

<select data-bind="value: loanAmount"></select>

编辑2 - 你的第二个问题

function updateData() {
    $.ajax({
        url: '/LoanApp/UpdateDeductionValues', //try to write the url like this
        data: { amount: self.selectedLoanAmount() },
        success: function (deductions) {
            //load your array with ko.utils.arrayMap
            self.loanDeductions(ko.utils.arrayMap(deductions, function (deduction) {
                 return new deductionLine(deduction.deductionID, deduction.deductionName, deduction.amount)
            }));
        }
    });
}

Answer 2

您的成功处理程序应如下所示。

function(result){
  self.loanDeductions(result);
}

除非你试图追加，否则它将是

  self.loanDeductions(self.loanDeductions().concat(result));

淘汰ViewModel更新

2 个答案: