使用敲除模板时可折叠菜单中的jquery eventbinding

我在MVC中有以下视图，我试图呈现一个可折叠菜单

@{
    ViewBag.Title = "Details";
    Layout = "~/Views/Shared/_Layout.cshtml";
}


@section Scripts {
  @Scripts.Render("~/bundles/jqueryval")
  <script type="text/javascript" src="@Url.Content("~/Scripts/knockout-2.2.0.js")"></script> 
  <script type="text/javascript" src="@Url.Content("~/Scripts/moment.js")"></script> 

 <script type="text/html" id="problemTemplate">
    <li>ID# <span data-bind="text: ProblemID"/>
    <ul data-bind="template: { name: 'visitTemplate', foreach: VisitList, as: 'visit' }"></ul>
    </li>
</script>

<script type="text/html" id="visitTemplate">
    <li> Visit <span data-bind="text: VisitID"></span> 
    </li>
</script>


  <script type="text/javascript">

      function MyViewModel() {
          var self = this;
          self.problems= ko.observableArray();
          $.getJSON("/api/clients/1/history", self.problems);
      }

      $(document).ready(function () {


          ko.applyBindings(new MyViewModel());

          $('#usernav').find('ul').hide();

          $('li').live("click", function (e) {
              $(this).children('ul').toggle();
              e.stopPropagation();
          });

      })


  </script>
}

<div class="content">
    <div id="title">
        <h1>Details </h1>
    </div>
    <div>
        <ul id="usernav" data-bind="template: { name: 'problemTemplate', foreach: problems, as: 'problem' }"></ul>

    </div>
    <div class="demo-section">
    </div>


</div>

@{
ViewBag.Title=“详细信息”；
Layout=“~/Views/Shared/_Layout.cshtml”；
}
@节脚本{
@Scripts.Render（“~/bundles/jqueryval”）
身份证


拜访

函数MyViewModel（）{
var self=这个；
self.problems=ko.observearray（）；
$.getJSON（“/api/clients/1/history”，self.problems）；
}
$（文档）.ready（函数（）{
应用绑定（新的MyViewModel（））；
$（'#usernav'）.find（'ul'）.hide（）；
$（'li'）.live（“单击”），函数（e）{
$（this.children（'ul'）.toggle（）；
e、 停止传播（）；
});
})
}
细节

我得到一个显示所有节点的常规列表。

---

似乎是

$（'#usernav'）.find（'ul'）.hide（）事件。如何解决此问题？
发生这种情况是因为在应用绑定时未填充
问题
ObservalArray。当json响应从服务器返回时，您需要隐藏它。最简单的方法是使用customBinding。小提琴：

html:

此外，您不再需要
$（'#usernav'）.find（'ul'）.hide（）呼叫。
或者您可以更改

self.problems= ko.observableArray();

致：

  ko.bindingHandlers.hideInitial = {
      init:function(element){
          console.log(element);
          $(element).hide();
      }
  }

self.problems= ko.observableArray();

self.problems= ko.observableArray([]);