How to remove logic from template?

For example, I have created a multi-selection list,

In the controller,

import Ember from 'ember';

export default Ember.Controller.extend({
  options: [
    'AAAAA',
    'BBBBB',
    'CCCCC'
  ],

  selected: []
});

Multi-selection component template,

<ul>

  <li  class="">
    
  </li>

</ul>

Component's JS,

import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    addSelection(option) {
      const selected = this.get('selected');
      if (selected.includes(option)) {
        selected.removeObject(option);
      } else {
        selected.addObject(option);
      }
    }
  }
});

As you can see, in code snippet #2 there is some sort of logic inside the template,

<li  class="">

I would love to remove the logic from the template because,

1. It makes the component hard to maintenance
2. Logic inside the template cannot handle complex data structure

Any suggestion is appreciated.