[ {"fileName":"111.pcap.00","startTime":"2018-06-05 10:16:04","taskName":"111","taskId":58,"fileId":72}, {"fileName":"111.pcap.01","startTime":"2018-06-05 10:16:55","taskName":"111","taskId":58,"fileId":73}, {"fileName":"aaa.pcap.00","startTime":"2018-06-05 10:10:28","taskName":"aaa","taskId":57,"fileId":71}, {"fileName":"www.pcap.00","startTime":"2018-06-05 10:50:28","taskName":"www","taskId":59,"fileId":79} ]
분석: 먼저 백엔드에서 반환된 데이터를 보면, ng-repeat를 사용하여 행(tr)을 직접 탐색하면 그림과 같이 병합 효과 없이 테이블이 생성됩니다.
어떻게 해결하나요? 떠오르는 한 가지 해결책은 동일한 taskName을 가진 데이터를 하나로 병합한 다음 이를 순회하는 것입니다. (자세한 내용을 보려면 PHP 중국어 웹사이트
angularjs 학습 매뉴얼을 방문하세요.)
구현 계획[ {"taskName":"111","fileList":[{"fileName":"111.pcap.00","startTime":"2018-06-05 10:16:04","taskName":"111","taskId":58,"fileId":72},{"fileName":"111.pcap.01","startTime":"2018-06-05 10:16:55","taskName":"111","taskId":58,"fileId":73}]}, {"taskName":"aaa","fileList":[{"fileName":"aaa.pcap.00","startTime":"2018-06-05 10:10:28","taskName":"aaa","taskId":57,"fileId":71}]}, {"taskName":"www","fileList":[{"fileName":"www.pcap.00","startTime":"2018-06-05 10:50:28","taskName":"www","taskId":59,"fileId":79}]} ]
var list = []; angular.forEach(sourceData,function (item) { for(var i=0;i<list.length><ul class=" list-paddingleft-2"><li>이제 여기 HTML을 보세요. <tr>에서 계속 ng-repeat를 수행하면 기대한 효과를 얻지 못할 것입니다. 각 데이터 조각에 taskName 필드가 포함되어 있고 ng-if='$index==0' 컨트롤을 사용하여 병합할 때 하나만 유지하면 되므로 이전 레이어인 </tr> <tbody>에서 순회해야 합니다. . <p></p> <pre class="brush:php;toolbar:false"> <tbody> <tr> <td>{{file.taskName}}</td> <td>{{item.fileName}}</td> <td>{{item.startTime}}</td> <td> <span> <a>下载</a> <span>删除</span> </span> </td> </tr> </tbody>
또한 이를 달성하는 방법이 여러 가지 있습니다. 다른 방법도 시도해 보았지만 이만큼 간단하지는 않습니다.
angularjs 학습 매뉴얼을 방문하여 학습하세요.) 궁금한 점이 있으면 아래에 메시지를 남겨주세요
위 내용은 테이블 병합 효과를 얻기 위해 AngleJs ng-repeat를 사용하는 방법 다음은 테이블 병합을 수행하는 ng-reap의 예입니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!