Bagaimana untuk Kumpulan Pemain mengikut Pasukan dalam Angular dengan ng-repeat?

Cara Menghimpun Data dalam Sudut dengan ng-repeat

Dalam AngularJS, modul penapis terbina dalam menyediakan fungsi utiliti yang dipanggil groupBy to membantu dengan pengumpulan data. Soalan ini menangani keperluan untuk mengumpulkan senarai pemain, masing-masing tergolong dalam pasukan tertentu, dan kemudian memaparkan pemain dalam kumpulan masing-masing.

Untuk mencapainya, langkah berikut boleh diambil:

1. Import Modul angular.filter:

Sebagai prasyarat, modul angular.filter mesti diimport dan ditambah sebagai pergantungan kepada modul utama aplikasi.

2. Sediakan Data Pemain:

Buat tatasusunan JavaScript yang mengandungi data pemain, dengan setiap objek pemain mempunyai sifat nama dan sifat pasukan yang menunjukkan pasukan pemain.

3 . Gunakan Penapis groupBy dalam Templat Sudut:

Dalam templat Sudut, gunakan penapis groupBy untuk mengumpulkan pemain berdasarkan sifat pasukan mereka. Penapis ini menerima ungkapan sebagai hujah, dalam kes ini, 'pasukan' untuk melaksanakan pengumpulan.

4. Lelaran ke atas Pemain Berkumpulan:

Gunakan arahan ng-repeat untuk mengulangi pemain berkumpulan. Setiap lelaran akan memberikan akses kepada kunci kumpulan (iaitu, nama pasukan) dan senarai pemain dalam kumpulan itu.

5. Paparkan Maklumat Kumpulan dan Pemain:

Dalam lelaran ng-repeat, paparkan kunci kumpulan (nama pasukan) dan nama pemain untuk setiap kumpulan.

Kod Contoh:

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

Dengan pendekatan ini, anda boleh mengumpulkan dan memaparkan pemain dengan berkesan berdasarkan pasukan mereka gabungan.

Atas ialah kandungan terperinci Bagaimana untuk Kumpulan Pemain mengikut Pasukan dalam Angular dengan ng-repeat?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!