Working with bootstrap modal and ember

I have a working version of bootstrap modals who open the nested list ('options') of a json who looks like that :

{ 
   product: [{
      id: 1,
      title: 'Some dope shoes',
      options: [
        { id: 1, name: 'Color' },
        { id: 2, name: 'Size' }
      ]
    },
    {
      id: 2,
      title: 'Some dope',
      options: [
        { id: 3, name: 'Lenght' },
        { id: 4, name: 'Flavor' }
      ]
    }
  ]
}

I've wrote everything for modals with templates I did used any file component. The trick is to make uniq modal id. Url looks like :

<a href="#" data-toggle="modal" data-target="#ma-modal{{optionid}}" title={{title}}>{{mmmh}}</a>

And modals looks like :

<div class="modal" id="ma-modal{{optionid}}"></div>

I don't feel confident about this code and because I'm learning ember I would like to know if doing all of this in template without any file components is something bad ?

Playing with the ids appears to me as a hack.