Question

我的视图模型中有一个函数，它应该将我的数组中的启用值从false更改为true。

  editclick: function (user) {
     user.enabled = true;
     return true;
  }

如果我发出警告以显示更改

user.enabled = true;
alert(ko.toJSON(user));

它显示它确实发生了变化，但绑定值没有变化。

如果我在变更前面发出警告

alert(ko.toJSON(user));
user.enabled = true;

第二次单击按钮时，警报会显示更改的值。

这是我的jsFiddle以及我使用的代码。

[JS]

var myViewModel = {
  myarray: ko.observableArray([{
     myname: 'Bob',
     mysurname: 'Smith',
     enabled: false
  }, {
     myname: 'John',
     mysurname: 'Smith',
     enabled: false
  }]),
  editclick: function (user) {
     user.enabled = true;
     alert(ko.toJSON(user));
     return true;
  }
};

[CODE]

<Table border="1" cellpadding="5" cellspacing="0">
 <thead>
    <tr>
        <td>Button</td>
        <td>Value</td>
    </tr>
 </thead>
 <tbody data-bind="foreach: myarray">
    <tr>
        <td>
            <input type="button" value="Change" data-bind="click: $root.editclick" />
        </td>
        <td><span data-bind="text: enabled" />
        </td>
    </tr>
 </tbody>
</Table>

我似乎更改不会更新viewmodel。有没有让这项工作。

感谢名单

Answer 1

ko.observableArray仅跟踪项目添加或删除。

因此，为了让KO跟踪项目内部的更改并自动更新UI，您需要创建属性ko.observable：

myarray: ko.observableArray([{
         myname: 'Bob',
         mysurname: 'Smith',
         enabled: ko.observable(false)
     }, {
         myname: 'John',
         mysurname: 'Smith',
         enabled: ko.observable(false)
     }])

并在您的editclick中，您需要将enabled设置为：user.enabled(true);（因为ko.observable会返回一个函数）

editclick: function (user) {
         user.enabled(true);
         alert(ko.toJSON(user));
         return true;
     }

演示JSFiddle.

从viewmodel函数更改observablearray值

1 个答案: