How do I add a Checkbox into a #{{link-to}} Helper

Question

The problem: I have a table with a link-to within an each. I want the first cell of each row to have a checkbox strictly for toggling. I can display the checkbox, but I can't get it to let me check it.

<table class="table table-hover">
  <thead>
    <th></th>
    <th>Things</th>
    <th>Stuff</th>
<th></th>
   </thead>
  <tbody>
  {{#each myArr as |item|}}
          {{#link-to 'application' tagName='tr' }}
      <td><input type="checkbox"></td>

      <td>{{item}}</td>
      <td> Something</td>

          {{/link-to}}
  {{/each}}
  </tbody>
</table>

• I don't want to go to the route
• The checkbox needs to toggle
• The checkbox doesn't need to hold a value (can be destroyed on page refresh)
• Using the {{input}} helper makes no difference

I have a twiddle https://ember-twiddle.com/bc53d499687ad8bdc902be5cd7d77f48

Answer 1

You need to separate as components.

Please look at this twiddle