1

我被卡住了,希望得到一些帮助!绑定的可观察数组发生更改后,表格不再刷新

我有一个创建方法在我的ViewModel调用微风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; 
    }); 

最后我微风数据服务暴露在虚拟机用来推动一个新的这个功能办公室变成可观察阵列:

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

你可以显示你使用的javascript来添加办公室到你的observableArray – 2013-04-22 20:39:15

+0

添加到你的数组后,表头是否显示? – 2013-04-22 21:10:12

+0

@AndrewWalters是的 - 它基本上保持不变。 – EdsonF 2013-04-22 21:13:33

回答

0

发现问题...

<td> 
    <div class="button-bar"> 
     <button class="btn btn-danger" 
       data-bind="click: deleteOffice, disable: hasChanges">Delete 
     </button> 
    </div> 
</td> 

我改变了按钮标签为<a href>,适用相同的风格和固定的问题!

相关问题