Angular 필터를 사용하여 팀별로 플레이어를 그룹화하고 표시하려면 어떻게 해야 합니까?

Angular Filter를 사용하여 데이터 그룹화

질문: 여러 팀에 속한 선수 목록이 있습니다. Angular 필터를 사용하여 팀별로 플레이어를 그룹화하고 표시하려면 어떻게 해야 합니까?

예제 데이터:

[{name: 'Gene', team: 'alpha'},
 {name: 'George', team: 'beta'},
 {name: 'Steve', team: 'gamma'},
 {name: 'Paula', team: 'beta'},
 {name: 'Scruath', team: 'gamma'}]

원하는 결과:

- team alpha
  - Gene
- team beta
  - George
  - Paula
- team gamma
  - Steve
  - Scruath

정답: 이 그룹화를 달성하려면 angle.filter에서 groupBy 필터를 활용할 수 있습니다. 모듈.

JavaScript:

$scope.players = [
  {name: 'Gene', team: 'alpha'},
  {name: 'George', team: 'beta'},
  {name: 'Steve', team: 'gamma'},
  {name: 'Paula', team: 'beta'},
  {name: 'Scruath', team: 'gamma'}
];

HTML:

<ul ng-repeat="(key, value) in players | groupBy: 'team'">
  <li>Group name: {{ key }}</li>
  <ul>
    <li ng-repeat="player in value">
      Player: {{ player.name }}
    </li>
  </ul>
</ul>

출력:

- Group name: alpha
  - Player: Gene
- Group name: beta
  - Player: George
  - Player: Paula
- Group name: gamma
  - Player: Steve
  - Player: Scruath

참고:

• 기억하세요 모듈의 종속성에 angle.filter를 포함시키려면.
• angular.filter에 대한 자세한 내용은 jsbin.com과 같은 외부 리소스를 참조하세요.

위 내용은 Angular 필터를 사용하여 팀별로 플레이어를 그룹화하고 표시하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!