我有角度材料表的問題。我制作了一個表格并實現(xiàn)了排序、分頁器、mat-tabs-group 和可擴展行。但是當我第一次顯示至少 10 個元素并按名稱排序時,錯誤出現(xiàn),行自身展開。當它在墊子標簽中時,我有這個問題,但在外面沒有。我認為這是表 cdk 和 mat-tabs-group 的問題。我有一個 Gif 來查看錯誤我在這里粘貼了我的 HTML 和 Ts 的一部分:........ @ViewChild(MatSort, {static: true}) sort: MatSort; @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator; constructor(private lightService: LightService, public dialog: MatDialog) { } ngOnInit() { this.dataSource.sort = this.sort; this.dataSource.paginator = this.paginator; this.lightService.getLamp() .subscribe( (response) => { this.lampData = response; this.dataSource.data = response; }, (error) => { console.log('error ' + error); } ); } .....HTML...... <ng-container matColumnDef="expandedDetail"> <td mat-cell *matCellDef="let element" [attr.colspan]="displayedColumns.length"> <div class="example-element-detail" *ngIf="element.error" [@detailExpand]="element === expandedElement ? 'expanded' : 'collapsed'"> <div> <p>serial : <strong>{{element.serial}} </strong></p> <p> {{element.name}} have a problem.</p> <p (click)="openDialog()" class="technician">Error message</p> </div> </div> </td> </ng-container> <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <tr mat-row *matRowDef="let element; columns: displayedColumns;" class="example-element-row" [class.example-expanded-row]="expandedElement === element"></tr> <tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="example-detail-row" ></tr> </table> <mat-paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 15]" showFirstLastButtons></mat-paginator> </div></div>
表 cdk 和 mat-tabs-group 的錯誤
慕無忌1623718
2021-10-21 16:34:40