emberjs: Passing selected value to select field in form

I am attempting to add a SELECT field from first principles using ember and am having difficulty working out how to pass the currently selected option to a form when editing a record.

I have set the form up as a component and am able to use it successfully when creating a new record, with the selected value being passed to the Rails backend. My issue is that I cannot work out a way to apply this selected value to the form component when editing an existing record.

Here is the component template section (book-form.hbs):

  <div class="form-group">
    <select id="format" onchange=>
      <option value=""></option>
      <option value="Paperback">Paperback</option>
      <option value="Hardcover">Hardcover</option>
      <option value="E-Book">E-Book</option>
    </select>

Template code (book-form.js):

import Component from '@ember/component';

export default Component.extend({
  actions: {
    submitChange(param) {
      this.onSave(param, this.selectedOpt);
    },
    selectedOpt: "",
    updateValue(value) {
      this.set('value', value);
      this.selectedOpt = value;
    },
  }
});

new & edit templates:

new controller:

export default Controller.extend({
  actions: {
    saveBook(newBook,format) {
      var tmp = this.store.createRecord('book', {
        title: newBook.title,
        author: newBook.author,
        genre: newBook.genre,
        format: format,
      });
      tmp.save();
      this.transitionToRoute('books.list');
    }
  }
});

edit controller:

  actions: {
    saveBook(book) {
      book.save();
      this.transitionToRoute('books.list');
    }
  }

I know I'm missing something somewhere to pass the model value through to the component but am not sure how to do it or where it belongs.

I would appreciate any assistance at all.