Angular5 需要功能来检查/取消选中 mat-table 内的 mat-checkbox

Question

我可以在表格中获取复选框以在选中/取消选中时发出更改，但是在单击地图图钉以切换复选框状态时遇到问题。

我的带地图的桌子

这是我的表：

      <mat-table [dataSource]="dataSource">
        <ng-container matColumnDef="number">
          <mat-header-cell *matHeaderCellDef> Number </mat-header-cell>
          <mat-cell *matCellDef="let stock">
            // #myCheckbox needs to be unique
            <mat-checkbox #myCheckbox [checked] (change)="selectStock(stock, $event)"></mat-checkbox> <a href="">{{ stock.number }}</a>
          </mat-cell>
        </ng-container>
        <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
        <mat-row *matRowDef="let row; columns: displayedColumns;" (click)="clickRow(row._id,$event)"></mat-row>
      </mat-table> 

然后从我的地图上，当你点击一个大头针时，运行一些功能

  (click)="someFunction(myCheckbox)"

在我的班级

    @ViewChild('myCheckbox') private myCheckbox: MatCheckbox;

    someFunction(myCheckbox){
         if (stock.isChecked) {
            this.myCheckbox.checked = false;
            } else {
            this.myCheckbox.checked = true;
         }
    }        

这是我正在处理的示例，但它对每个复选框应用了相同的 #id，因此只有第一个复选框被切换（我假设每个复选框都需要唯一的唯一 ID？）

• 角垫复选框 getElementById

Answer 1

在网站上进行更多搜索后，我能够使用 ViewChildren 解决该问题

• Angular 4：动态设置局部变量#

• *ngFor 的 angular4 局部变量问题

        @ViewChildren('myCheckbox') private myCheckboxes : QueryList<any>;
  
  
        someFunction(item, index){
  
            let myCheckboxes = this.myCheckboxes.toArray();
  
            if (item.isChecked) {
                myCheckboxes[index].checked = true;
            } else {
                myCheckboxes[index].checked = false;
            }
  
        } 
  

好东西