2017-03-05 5 views
1

Ich erstelle eine Google Map, die standardmäßig ein paar Marker zeigt. Wenn der Benutzer einen bestimmten Ort eingibt, muss der Marker nur für diesen Ort verbleiben und die verbleibenden Arbeiten müssen verschwinden. Während die Markierungen und die Karten arbeiten, ist die Filterfunktionalität ist nicht working.My JS Code wie folgt:knockout- Google maps marker filter

function inintMap() 
{ 

var map; 
var bounds = new google.maps.LatLngBounds(); 
var mapOptions = { 
    mapTypeId : 'roadmap' 
}; 

map = new google.maps.Map(document.getElementById('map'),mapOptions); 
map.setTilt(45); 

var locations = [ 
     ['London Eye, London', 51.503454,-0.119562], 
     ['Palace of Westminster, London', 51.499633,-0.124755] 
    ]; 



for (i=0; i < locations.length; i++) 
{ var position = new google.maps.LatLng(locations [i][1],locations [i][2]); 
bounds.extend (position); 
marker = new google.maps.Marker({ 
    position : position, 
    map : map, 
    title : locations [i][0] 
}); 


     map.fitBounds(bounds); 


} 



var vm = { 
    locations: ko.observableArray(locations) 
}; 


vm.query = ko.observable('') 
vm.search = function(value){ 

    vm.locations.removeAll() 

    for(var x in locations) { 
     if(locations[x].name.toLowerCase().indexOf(value.toLowerCase()) >= 0) { 
     viewModel.locations.push(locations[x]); 
     } 
    } 
    } 


vm.query.subscribe(vm.search); 
ko.applyBindings(vm); 
} 
+0

http://StackOverflow.com/Questions/500504/Why-isusing-for-in-in-array-Teratierung-a-bad-idea –

+0

Gibt es irgendwelche Fehler in der Konsole? Inwiefern funktioniert es nicht? –

Antwort

0

vm.locations.removeAll(). Aus diesem Code haben Sie bereits alle Standorte entfernt, bevor Sie überhaupt danach suchen können. Durchsuche es zuerst und lege die gesuchten Orte in ein anderes Feld, dann kannst du einfach die Orte durch das neue Feld ersetzen.

vm.search = function(value){ 
    var tempLocations = []; 
    for(var x in vm.locations()) { 
     if(vm.locations()[x].name.toLowerCase().indexOf(value.toLowerCase()) >= 0) { 
     tempLocations.push(vm.locations()[x]); 
     } 
    } 
    vm.locations(tempLocations); 
} 

auch zur Kenntnis nehmen, dass, wenn auf observablearrays Bezug genommen wird, können Sie es als eine Funktion aufrufen müssen, vergessen Sie nicht Ihre Klammer.