触发点击angularjs列表中的第一个元素

我是angularjs的新手，正在开发我的第一个应用程序。我有一个可以筛选和排序的用户列表：

<button ng-click="order='lastname'; reverse=!reverse">Sort by name</button>
<button ng-click="order='id'; reverse=!reverse">Sort by id</button>
<input type="text" ng-model="filter.user">
  <ul class="userlist" ng-class="{blur: currentUser}">
    <li ng-repeat="user in users | orderBy:order:reverse | filter:filter.user">
      {{user.id}} / {{user.firstname}} {{user.lastname}}
      <a href="#/user/{{user.id}}">Show details</a>
      <div ng-click="showDetails(user)">Show details in overlay</div>
    </li>
  </ul>   
  <div ng-show="details">
    <div ng-click="details=!details">close</div>
    {{user.custom}}
  </div>
  <div ng-show="currentUser" id="overlay">
    {{currentUser.firstname}} {{currentUser.lastname}} {{currentUser.custom}}
    <div ng-click="closeOverlay()">close</div>
  </div>

按名称排序
按id排序


{{user.id}/{user.firstname}{{user.lastname}}
在覆盖中显示详细信息


关闭
{{user.custom}}
{{currentUser.firstname}{{currentUser.lastname}{{currentUser.custom}}
关闭

我可以点击一个用户来获取他的详细信息。现在我想实现以下场景：当我在过滤器文本输入中按enter键时，我想显示当前列表中第一个

的详细信息。因此，在jQuery中，我会将一个按键事件绑定到输入，该输入将检查按键代码（13），然后触发：

$（'li'）.eq（0）。单击（）

，这将调用该特定用户的

showDetails（）

。

---

如何使用angular构建这样的功能？我尝试使用

ng keypress

指令，该指令允许我将函数绑定到某个按键，但现在我被卡住了，因为我不知道如何在第一个元素上触发

showDetails（）

函数。非常感谢您的帮助

这是一个暂时可以尝试的解决方法：让ng-keypress处理程序创建一个过滤结果列表（即，在控制器中的用户列表副本上重新应用过滤器），然后调用该列表的第一个egg元素的showDetails

---

它难看吗？对如果你在处理大名单，这是一个错误的决定吗？当然但是，在你找到另一种方法/更好的答案之前，它会让你继续前进。

以下方法应该有效。在

ng按键

处理程序中，设置按下enter键的属性，例如

enterPressed

。然后使用

ng init

，如下所示：

<li ng-init="isFirst($first, user)" ng-repeat="user in users | orderBy:order:reverse | filter:filter.user">
  {{user.id}} / {{user.firstname}} {{user.lastname}}
  <a href="#/user/{{user.id}}">Show details</a>
  <div ng-click="showDetails(user)">Show details in overlay</div>
</li>

---

我想出了一个非常优雅的解决方案：
在

ng repeat

中，您可以为当前结果集分配一个额外的变量（我称之为

filteredUser

：

<li ng-repeat="user in (filteredUser = (users | orderBy:order:reverse | 
filter:filter.user))" ng-click="showDetails(user)">

<li ng-repeat="user in (filteredUser = (users | orderBy:order:reverse | 
filter:filter.user))" ng-click="showDetails(user)">

<input type="text" ng-model="filter.user" ng-keypress="$event.keyCode == 13 ? 
showDetails(filteredUser[0]) : null">