2015-09-11 43 views
2

我似乎无法弄清楚这一点。我已经尝试过$(document).ready,但仍然不适用于我。我也试着为这两个值名称做一个for循环,将结果保存到一个var,并以这种方式传递它。我也试着把类和id的输入与父div和外面的搜索放在一起。本质上就像它在导航栏中。使用list.js & knockout.js顺便说一句。我正在使用aquares api使用ajax请求获取我的场地。List.JS - 无法读取未定义的属性'childNodes'

JS:

 var options = { 
     valueNames: ['name', 'category'] 
    }; 

    var userList = new List('search', options); 

HTML:

<body> 
<nav> 
    <h1 class="formattedH1">Downtown SA,TX</h1> 
    <span> 
     <input type="search" placeholder="Search" class="search" id="search"> 
     <input type="button" class="sort searchButton" value="List"></input> 
    </span> 
</nav> 
<div id="map" class="map"></div> 
<div class="list"> 
    <input type="search" placeholder="Search" class="search" id="search"> 
    <h1>My Top 5</h1> 
    <!-- Square card --> 
    <div class="card" id="favViewModel" data-bind="foreach: favList"> 
     <div class="expand"> 
      <h2 class="venueName" data-bind="text:name"></h2> 
     </div> 
     <div class="cardSupport" data-bind="attr: {src: image()}"> 
     </div> 
     <div class="cardSupport" data-bind="text:address"> 
     </div> 
     <a data-bind="attr: {href: website()}">Website</a> 
    </div> 
    <h1>Foursquare Recommended</h1> 
    <div class="card" id="recViewModel" data-bind="foreach: recommendedSpotList "> 
     <div class="expand"> 
      <h2 class="venueName" data-bind="text:name"></h2> 
     </div> 
     <div class="cardSupport" data-bind="text:location"> 
     </div> 
     <div class="cardSupport" data-bind="text:category"> 
     </div> 
     <div class="cardSupport" data-bind="text:rating"> 
     </div> 
    </div> 
    <script src="js/tester123.js"></script> 

回答

0

我发现我的答案浏览其它类似的项目,这么简单了。认为它可能会帮助某人,以防他们碰到这种情况。这是因为我正在做一个Ajax调用,我不得不把调用放到ajax请求中的ko.applybindings。绑定超出了范围,如果你认为它的意义,特别是如果你的请求失败。为什么甚至试图仍然绑定请求的值。如上HTML,和JS Ajax请求,请参阅以下内容:

JS:

$.ajax({ 
    url: 'https://api.foursquare.com/v2/venues/explore', 
    dataType: 'json', 
    data: 'data', 
    async: true, 
    success: function(data) { 

     venues = data['response']['groups'][0]['items']; 

     //This is where I had to place the binding to get it to render properly. 
     ko.applyBindings(new recommendedViewModel(), document.getElementById('recViewModel')); 

    }, 
    error: function() { 
     alert("An error occurred."); 
    } 
}); 
2

我定了同样的问题与项目的GitHub的页面上的一些评论,只要确保有相同的名称作为例子,它会工作,一切都必须在<div>ul必须有class列表

像这样

<div id="hacker-list"> 
    <ul class="list"></ul> 
</div> 

链接:https://github.com/javve/list.js/issues/9

+0

谢谢,我错过了ul元素上的列表类。难道我难倒了很久! –

相关问题