2017-08-04 47 views
0

帮助请帮助。我有22个物体,5个父母和17个孩子。 我无法得到ui li的孩子。使用数据绑定 敲出js。仅显示5位父母。提前致谢。获取列表的孩子ui li dropdown knockout.js数据绑定

enter image description here

enter image description here

Index.js

self._routes = ko.observableArray([]); 
    self._child = ko.observableArray([]); 
    for (var i = 0; i < backend.user().UserScreens.length; i++) { 
     var str = backend.user().UserScreens[i].addOn; //add icon 
     str = str.substring(0, str.length - 1); //trim last character ',' 
     if (backend.user().UserScreens[i].isParent || backend.user().UserScreens[i] == null) { 
      self._routes.push({ 
       route: backend.user().UserScreens[i].linkURL, 
       title: backend.user().UserScreens[i].description, 
       moduleId: 'modules/' + backend.user().UserScreens[i].linkURL.replace(/[\n\r]+/g, '').replace(/\s{2,10}/g, ' ') + '/index', 
       nav: true, 
       _icon: 'fa ' + str, 
       _id: '#' + backend.user().UserScreens[i].id 
      }); 
     } 
     else { 
      self._child.push({ 
       childRoute: backend.user().UserScreens[i].linkURL, 
       childtitle: backend.user().UserScreens[i].description, 
       childmoduleId: 'modules/' + backend.user().UserScreens[i].linkURL.replace(/[\n\r]+/g, '').replace(/\s{2,10}/g, ' ') + '/index', 
       childNav: true, 
       childIcon: 'fa ' + str, 
       childId: '#' + backend.user().UserScreens[i].id 
      }); 
     } 
    } 

的Index.html

<ul class="nav"> 
       <li data-bind="foreach: _routes"> 
        <a data-bind="attr: { href: _id }"><span data-bind="attr: {class: _icon}"></span> 
         <span class="sidebar-title" data-bind="text: title"></span><span class="caret"></span> 
        </a> 
        <ul data-bind="foreach: _child, attr: {id: childId}" class="nav sub-nav"> 
         <li><a href="#" data-bind="attr: {href: '#' + childRoute}"> 
          <span data-bind="attr: {class: _icon}"></span> 
          <span data-bind="text: childtitle"></span></a> 
         </li> 
        </ul> 
       </li> 
      </ul> 

回答

0

你的模型显示_routes_child在同一水平这就是为什么。

self._routes = ko.observableArray([]); 
self._child = ko.observableArray([]); 

因此您的child的foreach将翻倒的child属性不存在。该解决将是从路线的foreach删除child或添加$parent

<ul class="nav"> 
    <li data-bind="foreach: _routes"> 
     <a data-bind="attr: { href: _id }"><span data-bind="attr: {class: _icon}"></span> 
      <span class="sidebar-title" data-bind="text: title"></span><span class="caret"></span> 
     </a> 
     <!-- ko foreach: $parent._child --> 
     <ul data-bind="attr: {id: childId}" class="nav sub-nav"> 
      <li><a href="#" data-bind="attr: {href: '#' + childRoute}"> 
       <span data-bind="attr: {class: _icon}"></span> 
       <span data-bind="text: childtitle"></span></a> 
      </li> 
     </ul> 
     <!-- /ko --> 
    </li> 
</ul> 

但是,这将显示所有儿童的foreach路线,但我不这么看这条路线与孩子之间的任何相关性可能是你寻找的东西。

+0

谢谢先生。新手在knockout.js。 :) –