Question

我有一个视图模型。从ajax调用中检索人员

 var vm = ko.mapping.fromJS(persons, {});
 vm.Hobbies = ko.observableArray();
 // other vm objects

加载viewModel后我显示页面，现在我想将另一部分（爱好）加载到视图模型（工作）

// ...ajax call...
 success: function(results){
                ko.utils.arrayForEach(results.hobbies, function(item) {
                    vm.Hobbies.push(item);
                    });
      debugger  
    }

// ...end ajax call...

在调试器上，我可以看到我的爱好现已填充。

我有一个在页面加载时加载的视图

<!--ko if: $data.Hobbies-->
    <div>
      <ul class="fares-by-date-carousel" data-bind="foreach: Hobbies()">
            <li>2</li>
      </ul>
    </div>
<!-- /ko -->

一开始这个部分没有加载（因为还没有调用昂贵的ajax调用，这很好）但是在填充了vm.Hobbies之后，上面的html部分仍然没有显示。

不确定我缺少什么

Answer 1

问题在于您使用：

<!--ko if: $data.Hobbies-->

当您确定要迭代的父上下文时，应该使用此方法。例如，你可能会这样：

<!--ko foreach: Person -->
    <!--ko if: $data.Hobbies-->

在此示例中，$data代表每个Person，因此以下if检查将评估每个Person是否有业余爱好。

如果您没有使用此结构（没有父上下文），那么您不需要使用$data作用域，您可以使用$root作为视图模型范围（可以使用甚至在嵌套时）或者将它们全部放在一起。两者都应该有效：

<!--ko if: $root.Hobbies-->

<!--ko if: Hobbies-->

Knockout Binding Context

$ parent - 这是父上下文中的视图模型对象，即一个   紧接在当前背景之外。在根上下文中，这是   未定义。

$ root - 这是根上下文中的主视图模型对象，即   最顶层的父上下文。它通常是传递给的对象   ko.applyBindings。它相当于$ parents [$ parents.length - 1]。

$ data - 这是当前上下文中的视图模型对象。在里面   根上下文，$ data和$ root是等价的。在嵌套绑定中   上下文，此参数将设置为当前数据项（例如，   在with：person绑定中，$ data将设置为person）。 $ data是   当你想引用viewmodel本身而不是a时，它非常有用   viewmodel上的属性。

Knockout ViewModel在ajax之后正在更新，但是我的foreach没有被触发

1 个答案:

Knockout Binding Context