Modify data before render

What is the proper way to change data before rendering a template in below example?

model() from my route:

  model({contractId}){
    const cities = this.store.query('city', {contractId});
    return Ember.RSVP.hash({ cities});
  }

Then in my template:

And finally, in my component I'd like to change something in cities, so I created computed object in this way:

 cityOptions: Ember.computed('cities', function(){
    return this.get('cities').map((data)=> ({key: data.id, value: data.name}));
  }),

But this.get('cities') is returning something like this: Class {modelName: "city", query: Object, store: Class, manager: RecordArrayManager…} instead of data. Does anyone know something cool way to get pure data from this.get('cities')? Any help will be appreciated.