Question

我有 knockout 页面中心，我需要ko.obeservableArray嵌套在ko.observable对象中，这是我定义它们的地方：

 function IncomeDeclarationHub() {
    //data comes from a ajax call. 
    self.myIncomeDeclarationViewModel = ko.observable(new IncomeDeclarationViewModel(data));
 }

 function IncomeDeclarationViewModel(data) {
    var self = this;
    self.retentionAmount = ko.observable();
    self.taxableMonth = ko.observable();
    self.incDecDetGroViewModels = ko.observableArray();
    if (data != null) {
        var arrayLenght = data.IncDecDetGroViewModels.length;
        for (var i = 0; i < arrayLenght; i++) {
            var myObject = new IncomeDecDetGroViewModel(data.IncDecDetGroViewModels[i]);
            self.incDecDetGroViewModels.push(myObject);
        }
    }
 }

这是我的HTML代码：

  <span class="label">
       Retention Amount
  </span>
  <input data-bind="value: myIncomeDeclarationViewModel.retentionAmount" />
  <table>
      <tbody data-bind="foreach: myIncomeDeclarationViewModel.incDecDetGroViewModels">
          ...
      </tbody>
   </table>

好的，那就是incDecDetGroViewModels永远不会被填充，我以前在对象外面有ko.obersableArray，并且它工作正常，现在我将它插入对象myIncomeDeclarationViewModel没有填充html表。我是否需要在data-bind

以不同的方式调用它

Answer 1

以前你可以访问它只是becoz它在范围内，但现在你做了一些嵌套，所以你只需要在你的视图部分中进行一些循环来获得它。

这样的事情可能是：

<table data-bind="foreach:myIncomeDeclarationViewModel">
      <tbody data-bind="foreach:$data.incDecDetGroViewModels">
          ...
      </tbody>
   </table>

如果您寻找不同的东西，也可以使用ContainerLess foreach：

<!-- ko foreach:myIncomeDeclarationViewModel -->
//your table code
<!--/ko-->

我希望这能解决这个谜题。

Answer 2

myIncomeDeclarationViewModel是一个可观察的，所以你必须打开它才能访问它的属性。添加括号以打开它（访问可观察的基础值），如下所示：

<span class="label">
   Retention Amount
</span>
<input data-bind="value: myIncomeDeclarationViewModel().retentionAmount" />
<table>
  <tbody data-bind="foreach: myIncomeDeclarationViewModel().incDecDetGroViewModels">
      ...
  </tbody>
 </table>

这是一个基于你的例子

的工作jsFiddle

如何绑定嵌套在对象中的ko.obersavableArray

2 个答案:

JsFiddle