How to use the @angular/cdk/collections.SelectionModel function in @angular/cdk

private _resetSelection(): void {
		this.selection = new SelectionModel(this.isMultiSelectEnabled, []);

		// Emit event when selection changes
		if (this._selectionSub) {
			this._selectionSub.unsubscribe();
		}
		this._selectionSub = this.selection.changed.subscribe((change: SelectionChange) => {
			const selected: object[] = change.source.selected;
			this.selectChanged.emit(selected);
		});
	}

switchMap(() => this._itemSelectionChanges),
      );
    },
  );

  /** Output observable that fires every time the selection on the ToggleButtonGroup changes. */
  // Disabling no-output-native rule because we want to keep a similar API to the radio group
  // tslint:disable-next-line: no-output-native
  @Output() readonly change: Observable> = this
    ._itemSelectionChanges;

  /** Emits whenever the group component is destroyed. */
  private readonly _destroy = new Subject();

  /** Selection model for the current ToggleButtonGroup. */
  private _toggleButtonSelectionModel = new SelectionModel<
    DtToggleButtonItem
  >(false);

  /** @internal Content children which selects all DtToggleButtonItems within its content. */
  @ContentChildren(DtToggleButtonItem) _toggleButtonItems: QueryList<
    DtToggleButtonItem
  >;

  constructor(
    private _ngZone: NgZone,
    private _changeDetectorRef: ChangeDetectorRef,
  ) {}

  /** ngAfterContentInit Hook to initialize contentChildren observables.  */
  ngAfterContentInit(): void {
    // subscribe to toggleButtonItems changes in the contentchildren.

@Component({
  selector: 'app-photochange',
  templateUrl: './photochange.component.html',
  styleUrls: ['./photochange.component.css'],
})
export class PhotochangeComponent implements OnInit, OnDestroy {
  private _destroyed$: ReplaySubject;
  public currentPhoto: Photo;
  public currentMode: string;
  private uiMode: UIMode;

  displayedAssignedAlbumColumns = ['select', 'id', 'thumbnail', 'title'];
  dataSourceAssignedAlbum = new MatTableDataSource([]);
  displayedAvailableAlbumColumns = ['select', 'id', 'thumbnail', 'title'];
  dataSourceAvailableAlbum = new MatTableDataSource([]);
  selectionAssignedAlbum = new SelectionModel(true, []);
  selectionAvailableAlbum = new SelectionModel(true, []);
  // Enter, comma
  separatorKeysCodes: any[] = [ENTER, COMMA];

  isAllAssignedAlbumSelected() {
    const numSelected = this.selectionAssignedAlbum.selected.length;
    const numRows = this.dataSourceAssignedAlbum.data.length;
    return numSelected === numRows;
  }

  masterAssignedAlbumToggle() {
    this.isAllAssignedAlbumSelected() ?
        this.selectionAssignedAlbum.clear() :
        this.dataSourceAssignedAlbum.data.forEach((row: any) => this.selectionAssignedAlbum.select(row));
  }

@Component({
  selector: 'jm-job-list-table',
  templateUrl: './table.component.html',
  styleUrls: ['./table.component.css'],
})
@Injectable()
export class JobsTableComponent implements OnInit {
  @Input() dataSource: DataSource;
  @Output() onJobsChanged: EventEmitter = new EventEmitter();

  private mouseoverJob: QueryJobsResult;

  public displayFields: DisplayField[];
  public bulkLabelFields: BulkLabelField[];
  public selection = new SelectionModel(/* allowMultiSelect */ true, []);
  public jobs: QueryJobsResult[] = [];

  // currently Cromwell's limit; if there is some variability in other backends
  // this should be moved to a config
  public readonly labelCharLimit = 255;

  displayedColumns: string[] = ["Checkbox", "Job", "Details"];

  constructor(
    private readonly route: ActivatedRoute,
    private readonly jobManagerService: JobManagerService,
    private readonly capabilitiesService: CapabilitiesService,
    private readonly viewContainer: ViewContainerRef,
    private snackBar: MatSnackBar,
    public bulkEditDialog: MatDialog) { }

ngOnInit() {
        this._selectionModel = new SelectionModel(this.multiple, undefined, false);
        this.stateChanges.next();
    }
    /**

Object.keys(packages).forEach((packageCategory) => {
        if (packages) {
          for (const pkg of packages[packageCategory]) {
            this.ALL_PACKAGES.push({
              category: packageCategory,
              title: pkg["title"],
              description: pkg["description"],
              author: pkg["author"],
              repository: pkg["repository"],
              directory: pkg["directory"] ?? ""
            });
          }
        }
      });

      this.selection = new SelectionModel(true, []);
      this.dataSource = new MatTableDataSource(this.ALL_PACKAGES);
      this.dataSource.paginator = this.paginator;
      this.dataSource.sort = this.sort;

      this.tableUtility = new MagicMirrorTableUtility(this.selection, this.dataSource, this.sort, this.dialog);
    }).catch((error) => { console.log(error); });
  }

ngOnInit(): void {
        this._selectionModel = new SelectionModel(
            this.multiple, undefined, false);
    }

private _instanceSelectionModel() {
        this.selectionModel = new SelectionModel(this.multiple);
    }

enterAnimations,
    ],
})
export class UserTableComponent implements OnInit {
    public userSearchKey: UserListSearchKey | undefined = undefined;
    public Type: any = Type;
    @Input() type: Type = Type.TYPE_HUMAN;
    @Input() refreshOnPreviousRoutes: string[] = [];
    @Input() disabled: boolean = false;
    @ViewChild(PaginatorComponent) public paginator!: PaginatorComponent;
    @ViewChild('input') public filter!: Input;

    public viewTimestamp!: Timestamp.AsObject;
    public totalResult: number = 0;
    public dataSource: MatTableDataSource = new MatTableDataSource();
    public selection: SelectionModel = new SelectionModel(true, []);
    private loadingSubject: BehaviorSubject = new BehaviorSubject(false);
    public loading$: Observable = this.loadingSubject.asObservable();
    @Input() public displayedColumns: string[] = ['select', 'displayName', 'username', 'email', 'state', 'actions'];

    @Output() public changedSelection: EventEmitter> = new EventEmitter();

    public UserState: any = UserState;
    public UserListSearchKey: any = UserListSearchKey;

    constructor(
        public translate: TranslateService,
        private userService: ManagementService,
        private toast: ToastService,
        private dialog: MatDialog,
        private route: ActivatedRoute,
    ) {

@Input()
    icon: string

    @Output()
    searchChanged = new EventEmitter()

    @Output()
    selectionEntitiesChanged = new EventEmitter()

    @ViewChild('tree', { static: false })
    tree: MatTree
    selectedEntities$: BehaviorSubject = new BehaviorSubject([])
    selectedEntities: ShortEntityModel[] = []
    selectableEntityNodes: SelectableBackupNode[] = []
    checkEntitieslistSelection = new SelectionModel(true)

    private transformer = (node: SelectableBackupNode, level: number) => {
        const selectableNode: BackupNode = {
            id: node.id,
            name: node.displayName,
            checked: false,
            level,
            expandable: !!node.subShortModels && node.subShortModels.length > 0,
            refModel: node
        }
        if (!!this.selectedEntities && this.selectedEntities.length > 0 && level > 0) {
            const found = _.find(this.selectedEntities, entity => entity.id === node.parentId)
            if (!!found) {
                selectableNode.checked = found == selectableNode.id
                if (selectableNode.checked) {
                    this.checkEntitieslistSelection.select(selectableNode)