Question

我在MVC 5 / Knockout环境中工作。 My View最初是从标准MVC 5控制器提供的ViewModel加载的。我有一个淘汰赛网格作为这个观点的一部分。根据ViewModel内容正确填充网格。

在用户按钮推送上，进行Web API调用并成功返回。我想使用从API调用返回的数据来更新绑定到挖空网格的Knockout可观察数组。我可以看到knockout observable数组已正确更新，但淘汰网格永远不会刷新。我使用API调用的结果写入的knockout observalbe数组与首次加载View时写入的数组相同。

这是.cshtml视图顶部的代码：

<script>
    $(function () {
        var inputData = ko.mapping.toJS(@Html.Raw(HelperFunctions.ToJson(Model)));
        var dom = document.getElementById("AWBSNode");
        var obj = new AreasModel(inputData);
        ko.applyBindings(obj, dom);
    });
</script>

AWBSNode是我的cshtml中最顶层的div。下面是我网格的html

<div id="koGridPanel" class="panel panel-default top-buffer">
     <div class="panel-heading">AWBS - Areas</div>
     <div class="koGrid" data-bind="koGrid: gridOptions"></div>
</div>

以下是我的View Model / grid config / binding

的相关JS

var AreasModel = function(data) {
    var self = this;
    var apiCall = new APICaller();
   .
   .
   .
   self.AllAWBSAreas = ko.observableArray(
       ko.utils.arrayMap(data.Areas, function(x) {
          return new NewAWBSAreaModel(x);
       })
   );
  .
  .
  .
  this.gridOptions = {
        footerRowHeight: 35,
        beforeSelectionChange: function (rowItem) {
           self.selectAreaToEdit(rowItem); 
        },
        disableTextSelection: false,
        keepLastSelected: false,
        multiSelect: false,
        displaySelectionCheckbox: false,
        data: self.AllAWBSAreas,
        columnDefs: [
            { field: 'Name', displayName: 'Name' }, 
            { field: 'Description', displayName: 'Description' }
        ]
    };
  .
  .
  .

下面是我调用的API调用（我正在使用包装函数，但该部分工作正常，因为我进入成功路径并且数据在那里

apiCall.CallAPI(
    url,
    dom,
    true,
    null,
    function (successData) {
       self.AllAWBSAreas(ko.utils.arrayMap(successData.Items, function (x) {
           return new NewAWBSAreaModel(x);
       });
    );

我也尝试了

的替代方法

apiCall.CallAPI(
    url,
    dom,
    true,
    null,
    function (successData) {
        self.AllAWBSAreas(successData.Items); 
        .
        .
        .
        .

我尝试在valueHasMutated()实体上调用AllAWBSAreas。 API调用及其返回数据没有问题，因为此模式在项目的所有其他方面都能正常工作。我看到的症状是UI中的网格“受影响”但未更新。顶部整洁的蓝色横幅空白，但数据保持不变。

如何在AJAX API调用后刷新淘汰网格

0 个答案: