Ember.js CollectionView strange behavior - ember.js

Question

I am trying to create autocomplete behavior with emberjs. I am observing in the controller an input field (searchCity) and making ajax calls according to that field. I have a view which handles additional logic, and should display a list of clickable cities as suggestions. So far I have the following code:
var labelView = Ember.View.extend({
templateName: 'searchedCities',
geoData: null,
click:function(){
debugger;
}
}),
ModalView = Ember.View.extend({
layoutName: 'modal_layout',
cities: null,
didInsertElement: function() {
this.cities = Ember.CollectionView.create({
tagName: 'span',
itemViewClass: labelView
});
},
cityList: function(){
var callback,
cities = this.get('cities'),
searchCity = this.get('controller').get('searchCity'),
regExp = new RegExp(searchCity, 'i');
if (!searchCity){
return;
}
callback = function(data){
var aux = data.filter(function(geoObjects){
return geoObjects.city.match(regExp);
}).slice(0,9);
cities.clear();
aux.forEach(function(geoData){
cities.pushObject(labelView.create({geoData:geoData}));
});
};
Store.resolveGeoData(callback);
}.property('controller.searchCity')
});
In my template I have the following code:
{{view Ember.TextField valueBinding=searchCity placeholder="City"}}
{{#each view.cities}}
{{this.geoData.city}}
{{/each}}
{{#each view.cityList}}
{{this.city}}
{{/each}}
Even though in the callback I can check that the cities are populated with the views in my template nothing is shown if i remove the {{#each view.cityList}}{{/each}}, but it displays if I leave it there.