使用 ember-bootstrap 使行可点击

Make a row clickable with ember-bootstrap

这是我的 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>

如您所见,此面板的每个元素 link 都具有相同的配置文件,但我想知道是否有办法使 整个 行可点击,不是每个元素。
这意味着我想在每个 {{user.*}} 之间点击,而不仅仅是点击它们,将我发送到个人资料。我已经搜索过了,但找不到 bootstrap 和车把的答案。
感谢您的宝贵时间!

您可以将 {{link-to}} 助手设置为如下所示的行元素。

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

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

   ....

{{/link-to}}