展开式行始终以斜线显示

问题描述

我正在使用角度材质表，始终显示可扩展行，但隐藏其中的内容。单击复选框旁边的图标按钮时，将显示内容，但最初将始终显示可隐藏的行 这是我的代码 html：

   <td mat-cell *matCellDef="let element" class="set-td" style="width: 10px;">
                        <button mat-icon-button (click)="element.isExpanded = !element.isExpanded > 
        <mat-icon>keyboard_arrow_right</mat-icon></button>
                        <mat-checkBox ></mat-checkBox>
                      </td>

 <ng-container matColumnDef="expandedDetail" >
      <td mat-cell *matCellDef="let element" [attr.colspan]="displayedColumns.length" >


        <div class="student-element-detail"  [@detailExpand]="element.isExpanded ? 'expanded' : 'collapsed'" style="margin-top: 25px">
          <div style="text-align: left;">
            <span style="float: left;"> <button mat-button style="maring-left:40px">CREATE</button></span>
          </div>
        </div>
     </td>
 </ng-container>
                    <tr mat-header-row *matHeaderRowDef="displayedColumns;sticky: true"></tr>
                
                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [class.student-expanded-row]="isExpanded"> </tr>                    
                        <tr  mat-row *matRowDef="let row; columns: ['expandedDetail']"  class="expandable-row"></tr>  <---this tr tag will always be displayed

打字稿：

  expandedElement: any;
  isTableExpanded :any;
  isExpanded:any;
    // Toggel Rows
    toggleTableRows() {
      this.isTableExpanded = !this.isTableExpanded;
      //this.isExpanded=!this.isExpanded
  
      this.BusinesdataSource.data.forEach((row: any) => {
         row.isExpanded = this.isTableExpanded;
        //row.isExpanded=this.isExpanded;
      })
    }

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）