Ember.Select via DS.belongsTo()

Ember Data
1

I have a model city defined like this:

// app/models/city.js
import DS from 'ember-data';

var City = DS.Model.extend({
    name: DS.attr('string'),
    province: DS.belongsTo('province', {async: true})
});

As well as a model province defined like this:

// app/models/province.js
import DS from 'ember-data';

var Province = DS.Model.extend({
    name: DS.attr('string')
});

I would like to be able to edit the city name or create a new one and select the provinces from a select box.

In my edit template I include the following:

{{!-- app/templates/cities/edit.hbs --}}
...
{{input type="text" class="form-control" id="name" value=model.name}}
...
{{input type="text" class="form-control" id="province" value=model.province.name}}

which works just fine for free form text editing, but for I want to replace the {{input ... id="province" ... }} with a selection box, something like this:

{{view "select" 
  content=???provinces???
  optionValuePath="content.id"
  optionLabelPath="content.name"
  value=model.province.name
}}

So that when I save the changes they are updated in the model also with the correct values.

How do I define the content ???provinces??? and how can I access an external provinces model outside of cities?