Mvvm with knockout:数组绑定和更改内部对象状态

Question

我的View Model中有一个数组.此数组的项是具有两个属性的Person对象.当我将它绑定到模板时,它没关系.但是当我更改其中一个属性的状态时,它不会反映在UI中.

我做错了什么 ？

<script type="text/html" id="person-template">
    <p>Name: <span data-bind="text: name"></span></p>
    <p>
        Is On Facebook ?
        <input type="checkbox" data-bind="checked: IsOnFacebook" />
    </p>
</script>

<script type="text/javascript">
    var ppl = [
            { name: 'Pouyan', IsOnFacebook: ko.observable(true) },
            { name: 'Reza', IsOnFacebook: ko.observable(false) }
    ];
    function MyViewModel() {
        this.people = ko.observableArray(ppl),
        this.toggle = function () {
            for (var i = 0; i < ppl.length; i++) {
                ppl[i].IsOnFacebook = false;
            }
        }
    }
    ko.applyBindings(new MyViewModel());
</script>

当我按下按钮时我想在People.IsOnFacebook属性中进行更改.更改将成功,但UI不显示.

Answer 1

你应该把它称为函数.喜欢:

ppl[i].IsOnFacebook(false);

这是因为ko.observable()返回一个函数.它不是你打电话的属性,而是一个函数调用.因此,在后台他们将更新您的UI.撤回可观察的财产.您还应该使用函数调用.

请参阅本教程:http://learn.knockoutjs.com/#/？ tutorial = intro