0

我有一个控制器 $scope.users = [{id: 1, name: "Test"}, {id: 2, name: "Dude"}];

我想做类似 {{id | getName}} 并且它会使用我拥有的 id，抓取 $scope.users 以查找相应的 ID 并根据 id 的值输出“Test”或“Dude”。

我应该在 angularJS 中使用什么来实现这一点？

<table class="table table-striped">
  <thead>
    <tr>
      <th>Winner</th>
      <th>Loser</th>
      <th>Date</th>
    </tr>
  </thead>
  <tbody ng-repeat="match in matchs">
    <tr>
      <!-- What I want is instead of winner_id / loser_id go and get from $scope.users the id and output user name instead -->
      <td>{{match.winner_id}} - {{match.winner_score}}</td>
      <td>{{match.loser_id}} - {{match.loser_score}}</td>
      <td>{{match.created_at}}</td>
    </tr>
  </tbody>
</table>

http://jsfiddle.net/wHVG6/

4

1 回答 1

2

不用自己写，使用内置过滤器：

{{(users | filter:{id: 1})[0].name}}

您自己的过滤器可能类似于：

app.filter('getName', ['filterFilter', function (filterFilter) {
  return function (input, id) {
    var r = filterFilter(input, {id: id})[0];
    return r && r.name;
  };
}]);

和：

{{users | getName:2}}

不过，请注意输入是id users，而不是id。这是必需的，因为过滤器没有直接的范围访问权限，因此您必须提供所需的所有数据。

或者，您可以将其包装在一个简单的 getter 函数中：

$scope.getName = function getName(id) {
  return getNameFilter($scope.users, id);
};

和：

{{getName(3)}}

演示：http: //jsbin.com/exezik/4/

完整代码：

(function (app, ng) {
  app.controller('TestCtrl', ['$scope', 'getNameFilter', function ($scope, getNameFilter) {
    $scope.users = [{id: 1, name: "Test"}, {id: 2, name: "Dude"}, {id: 3, name: "Foobar"}];

    $scope.getName = function getName(id) {
      return getNameFilter($scope.users, id);
    };
  }]);

  app.filter('getName', ['filterFilter', function (filterFilter) {
    return function (input, id) {
      var r = filterFilter(input, { id: id})[0];
      return r && r.name;
    };
  }]);
}(angular.module('Test', []), angular));
于 2013-06-26T14:42:29.307 回答