Сделайте строку кликабельной с помощью ember-bootstrap

Question

Вот пример моего кода hbs.

<div class="table-responsive">
    <table class="table table-striped">
        <thead>
        <th>#Id</th>
        <th>{{t 'firstname'}}</th>
        <th>{{t 'lastname'}}</th>
        <th>{{t 'email'}}</th>
        <th>{{t 'username'}}</th>
        </thead>
        <tbody>
        {{#each users as |user|}}
            <tr>
                <td>
                    {{#link-to 'profile' user.id}}
                        {{user.id}}
                    {{/link-to}}
                </td>
                <td>
                    {{#link-to 'profile' user.id}}
                        {{user.firstname}}
                    {{/link-to}}
                </td>
                <td>
                    {{#link-to 'profile' user.id}}
                        {{user.lastname}}
                    {{/link-to}}
                </td>
                <td>
                    {{#link-to 'profile' user.id}}
                        {{user.email}}
                    {{/link-to}}
                </td>
                <td>
                    {{#link-to 'profile' user.id}}
                        {{user.username}}
                    {{/link-to}}
                </td>
            </tr>
        {{/each}}
        </tbody>
    </table>
</div>

Как видите, каждый элемент этой панели ссылается на один и тот же профиль, но мне было интересно, есть ли способ сделать весь ряд кликабельным, а не каждый элемент.
Это означает, что я хочу нажимать между каждым {{user. *}}, А не только на них, чтобы отправить меня в профиль. Я уже искал это, но я не мог найти ответ для начальной загрузки и руля вместе.
Спасибо за ваше время!

Answer 1

U может установить помощник {{link-to}} для элемента строки, как показано ниже.

{{#link-to "profile" user.id tagName = "tr"}}

   <td>
       <a>
         {{user. firstname}}
       </a>
   </td>
   <td>
       <a>
         {{user. email}}
       </a>
   </td>

   ....

{{/link-to}}