將我的搜索過濾器鏈接到列表項：knockout js

我需要幫助鏈接我的ul和li來自動過濾搜索。我不知道該從哪裏走。將我的搜索過濾器鏈接到列表項：knockout js

self.filterMarkers = function() { 
    console.log(self.searchQuery); 
    var searchInput = self.searchQuery().toLowerCase(); 

    self.visiblePlaces.removeAll(); 

    self.allPlaces.forEach(function(place) { 
    console.log(place); 
    place.marker.setVisible(false); 

    if (placeName.toLowerCase().indexOf(searchInput) !== -1) { 
     self.visiblePlaces.push(place); 
    }; 
    }); 

    self.visiblePlaces().forEach(function(place) { 
    console.log(place); 
    place.marker.setVisible(true); 
    }); 
};

，我需要爲我的名單和標記，當我在搜索輸入類型來更新。幫幫我？

來源

2015-12-02 ryanwaite28

請閱讀：stackoverflow.com/help/mcve和更好地解釋你想做的事。「當我輸入搜索輸入時，我需要更新列表和標記。」那個清單在哪裏？什麼是標記？ serach輸入在哪裏？這個問題意味着什麼？ – JotaBe

您可能想要爲您的過濾結果使用計算：http://knockoutjs.com/documentation/computedObservables.html –

也許如果你使用ko.computed(callback,this)，我編寫了一個例子來向你展示其中一種可能的方法，我希望能有用X）。

請參閱snnipet。

function ViewModel(){ 
 
    var self =this; 
 
    this.filter = ko.observable(); 
 
    
 
    this.places = ko.observableArray([{name:"New York"},{name:"Los Angeles"},{name:"Curitiba"},{name:"Rio de Janeiro"}]); 
 
    
 
    
 
    this.visiblePlaces = ko.computed(function(){ 
 
     return this.places().filter(function(place){ 
 
      if(!self.filter() || place.name.toLowerCase().indexOf(self.filter().toLowerCase()) !== -1) 
 
      return place; 
 
     }); 
 
    },this); 
 
    
 
    
 
} 
 

 
ko.applyBindings(new ViewModel());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 

 
<label for="filter">Filter:</label> 
 
<input id="filter" type="text" data-bind="textInput: filter"/> 
 

 
<ul data-bind="foreach: visiblePlaces"> 
 
    <li data-bind="text: name"></li> 
 
</ul>

來源

2015-12-03 12:44:55

@ ryanwaite28 ??? –

將我的搜索過濾器鏈接到列表項：knockout js

回答

相關問題