在 mat-table 中加载初始值时不选中复选框答案

【问题标题】：Checkbox are not checked when initial values are loaded in a mat-table在 mat-table 中加载初始值时不选中复选框
【发布时间】：2019-07-03 04:58:52
【问题描述】：

想要加载一个带有已使用来自本地存储变量的初始值选中的复选框的表。我已经把初始数据放在 selectionModel 中了：

this.servChecked = [
    {tipo: 'Servicio', descripcion: 'Visit', cantidad: '1', codsrv: '11123'},
    {tipo: 'Equipo', descripcion: 'RPV', cantidad:'1', codsrv: '11124'}
  ];

this.selection = new SelectionModel<ServiciosAdicionales>(true, this.servChecked);

It does load the array in the selection.selected but the checkboxs are not checked.

TS:

 this.servChecked = JSON.parse(localStorage.getItem("servAdicionales"));
    this.infoCompleta = JSON.parse(localStorage.getItem("infoParaServiciosAdicionales"));
    this.tipoServicio = this.route.snapshot.paramMap.get("tipoServicio");

    let listEquipos = [];
    let listServicios = [];
    this.datosServicios.forEach(element => {
      switch(element.tipo) {
        case '1':
          element.tipo = 'Servicio'
          listServicios.push(element);
          break;
        case '2':
          element.tipo = 'Equipo'
          listEquipos.push(element);
          break;
      }
    });

    this.dataSource = new MatTableDataSource<ServiciosAdicionales>(this.datosServicios);
    this.dataSourceEquipo = new MatTableDataSource<ServiciosAdicionales>(listEquipos);
    this.dataSourceServicio = new MatTableDataSource<ServiciosAdicionales>(listServicios);

    this.selection = new SelectionModel<ServiciosAdicionales>(true, this.servChecked);

我希望在加载初始值时选中复选框。

【问题讨论】：

你能在stackblitz中复制问题还是分享你的所有代码

标签： angular checkbox mat-table selectionmodel

【解决方案1】：

您试图推入选择模型的对象来自数组dataosServicios。但是选择模型会寻找将在表格中呈现的对象。这将是与数组不同的实际行对象。

初始化dataSource后，试试下面的代码：

this.selection = new SelectionModel<ServiciosAdicionales>(true, this.dataSourceEquipo.data[0]);

上面的代码将选择表格中的第一行。

要回答您的问题，请从 localStorage 获取数据，然后为表创建数据源。将 localStorage 中的对象映射到 dataSource.data，然后将 dataSource.data 对象添加到 selectionModel 数组中。

【讨论】：