o valor padrão da tag <select> é definido em chrome e edge, mas não no IE

Estou definindo dois valores 2018 e My Name no método criado para duas propriedades de dados separadas. Estou passando a propriedade de dados como v-bind para um componente.

Meu problema é que em chrome e edge ambos os valores estão sendo configurados para dois dropdowns (tag) como valor padrão no carregamento da página. mas no IE 11 apenas o valor do ano está sendo definido no carregamento da página, não o valor do meu nome.

Alguém sabe por que isso?

App.view

data: function() {
  return {
    selectedYear: null,
    selectedFacility: null,
  }
},
created: function() {
  //this line will return 2018
  this.selectedYear = this.tableData.year.replace(/\D/g, "");
  //this return will return "My Name"
  this.selectedFacility = this.tableData.tableInfo.rows[0].sName;
}

<template>
  <filter-page v-bind:years="years" v-bind:sel-year="selectedYear"
  v-bind:available-facility="tableData" v-bind:sel- 
   facility="selectedFacility"></filter-page>
 </template>

em filterPage.vue

<select class="form-control input-sm" style="width:120px" id="select-Year" v-model="selYear">
<option v-for="yr in years" v-bind:value="yr" >{{ yr }}</option>
</select>

<select class="form-control input-sm" id="select-facility" v-model="selFacility">
 <option v-for="fieldRows in availableFacility.tableInfo.rows">
       {{fieldRows.facilityName}}
 </option>
</select>