knockout.js - バインドされた監視可能な配列が変更された後、テーブルが更新されない

Question

私は立ち往生しており、助けていただければ幸いです！

ViewModel に create メソッドがあり、CreateEntity メソッドを簡単に呼び出して、Office 型の監視可能な配列に新しい項目を追加します。これはすべてうまくいき、観測可能な配列の長さはそれに応じて増加します-しかし！

何らかの奇妙な理由で、テーブルの行がそれに応じて更新されません-何が間違っていますか???

これはテーブルのマークアップです:

---

<table class="table table-striped table-bordered table-condensed" data-bind='visible: offices().length > 0'>
            <thead>
                <tr>
                    <td class="thead">Office Name</td>
                    <td class="thead">Support Tel.</td>
                    <td class="thead">Support Email</td>
                    <td class="thead">Support Fax</td>
                    <td class="thead">Ftp URL</td>
                    <td class="thead" />
                </tr>
            </thead>
            <tbody data-bind='foreach: offices'>
                <tr class="">
                    <td>
                        <input data-bind='value: officeName' />
                    </td>
                    <td>
                        <input data-bind='value: supportNo' />
                    </td>
                    <td>
                        <input data-bind='value: supportEmail' />
                    </td>
                    <td>
                        <input data-bind='value: supportFax' />
                    </td>
                    <td>
                        <input data-bind='value: supportFtp' />
                    </td>
                    <td>
                        <div class="button-bar">
                            <button class="btn btn-danger"
                                data-bind="click: deleteOffice, disable: hasChanges">
                                Delete
                            </button>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>

これは私のviewModelコードです

define(['services/officesEntityService',
        'durandal/plugins/router',
        'durandal/system',
        'durandal/app',
        'services/logger'],
    function (officesEntityService, router, system, app, logger) {

        var offices = ko.observableArray();
        var isSaving = ko.observable(false);
        var isDeleting = ko.observable(false);

        var activate = function () {
            return officesEntityService.getOffices(offices);
        };

       ...

        var addOffice = function () {
            offices.push(officesEntityService.createOffice());
        }

        ...

        var vm = {
            offices: offices,
            isSaving: isSaving,
            isDeleting:isDeleting,
            activate: activate,
            goBack: goBack,
            hasChanges: hasChanges,
            cancel: cancel,
            canSave: canSave,
            save: save,
            canAdd:canAdd,
            addOffice:addOffice,
            deleteOffice: deleteOffice,
            canDeactivate: canDeactivate,            
            title: 'Offices Administration'
        };
        return vm;
    });

最後に、私の Breeze Data Service は、VM で使用されるこの関数を公開して、新しいオフィスを監視可能な配列にプッシュします。

var createOffice = function () {
            return manager.createEntity('Office', { officeId: jQuery.Guid.New(), officeName: 'New Office'});
        };