ko.observableArray 不是 UI 不更新。答案

【问题标题】：ko.observableArray not UI not UPdating.ko.observableArray 不是 UI 不更新。
【发布时间】：2016-07-07 01:56:11
【问题描述】：

我有一个初始化的 Ko 模型，它有一个 observableArray，然后在以后填充数据。但是，用户界面似乎并未确认更改。我最初使用的是不可观察数组，因为添加或删除项目时不会触发任何内容。帮助不大。

我初始化数据数组以备后用 var 数据 = [];

  $(function () 
{
  KoAppViewModel = {
        SF: ko.observableArray(Data),
        selected: ko.observable("")
    };
    ko.applyBindings(KoAppViewModel);
})

将每个新项目添加到数组中

   function searchColumns(columnName, displayValue) {
        return {
            columnName: columnName,
            displayValue: displayValue

        };
    }

这部分只是在代码后面的某个点填充数组。

 function Initialize Fields() {
       data = [
           new searchColumns("sub", "Subs"),
           new searchColumns("ck", "Check"),
           new searchColumns("Ntes", "Notes"),

       ];
    ko.utils.arrayPushAll(Data, data);
    }

这是 Html 的存根，它遍历数组并填充 UL。如果我用数据初始化数组但在以后添加它似乎会忽略它，这会起作用。我试图循环并单独添加它们也没有成功。

 <ul data-bind="foreach:SF">
                        <li style="list-style-type:none;">
                            <input type="radio" data-bind="checkedValue: columnName, checked: $parent.selected" name="SearchFieldstyu" />&nbsp;
                            <span data-bind="text: displayValue"></span>
                        </li>
                    </ul>

【问题讨论】：

标签： arrays knockout.js

【解决方案1】：

只是忘记在填充后将 valueWillMutate() 和 valueHasMutated() 添加到底层数组。

 function Initialize Fields() {
       data = [
           new searchColumns("sub", "Subs"),
           new searchColumns("ck", "Check"),
           new searchColumns("Ntes", "Notes"),

       ];



 KoAppViewModel.SF.valueWillMutate();



 ko.utils.arrayPushAll(Data, data);
    }

KoAppViewModel.SF.valueHasMutated();

【讨论】：