How do you add an initial selection for Angular Material Table SelectionModel?

If you do the following, it works too

selection = new SelectionModel<PeriodicElement>(true, [ELEMENT_DATA[1]])

To select all you can do

selection = new SelectionModel<PeriodicElement>(true, [...ELEMENT_DATA])

I hope the answer is helpful

I was facing the same issue, I used dataSource to set the initial value manually in ngOnInit()

ngOnInit() {
    this.dataSource.data.forEach(row => {
      if (row.symbol == "H") this.selection.select(row);
    });
  }

Tricky one. You need to initialize the selection by extracting that particular PeriodicElement object from your dataSource input, and passing it to the constructor.

In this particular case, you could code

selection = new SelectionModel<PeriodicElement>(true, [this.dataSource.data[1]);

It's because of the way SelectionModel checks for active selections.

In your table markup you have

<mat-checkbox ... [checked]="selection.isSelected(row)"></mat-checkbox>

You expect this binding to mark the corresponding row as checked. But the method isSelected(row) won't recognize the object passed in here as being selected, because this is not the object your selection received in its constructor.

"row" points to an object from the actual MatTableDataSource input:

dataSource = new MatTableDataSource<PeriodicElement>(ELEMENT_DATA);

But the selection initialization:

selection = new SelectionModel<PeriodicElement>(true, [{position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'}]);

happens with a new object you create on the fly. Your selection remembers THIS object as a selected one.

When angular evaluates the bindings in the markup, SelectionModel internally checks for object identity. It's going to look for the object that "row" points to in the internal set of selected objects.

Compare to lines 99-101 and 16 from the SelectionModel source code:

isSelected(value: T): boolean {
  return this._selection.has(value);
}

and

private _selection = new Set<T>();